Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Post an Article
Welcome To Ask or Share your Answers For Others

Categories

jquery - How can I list the uploads from a YouTube Channel?

0 votes
354 views
in Technique[技术] by (71.8m points)

jquery - How can I list the uploads from a YouTube Channel?

I am writing this code to search youtube channels on my website and then list their uploads after clicking on them. However currently my links all on all channels to the last channel listed's uploads and I cant tell how in my code that allows that to happen. Can someone have a look and give me an idea of what is going wrong. You can also try/see the website on www.youtubebypass.dx.am

   <!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>YouTube</title>
 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="app.js"></script>
<script src="https://apis.google.com/js/client.js?onload=googleApiClientReady"></script>
<link href="style.min.css" rel="stylesheet">
<script>

     function channelsearch(){
             gapi.client.setApiKey('AIzaSyAhXRvLpBIyLlOQ9N0W6qUNNqNrhmQBovY')

             gapi.client.load('youtube', 'v3', function() {
                     makechannelRequest();
        });
     }

      function makechannelRequest() {
        var q = $('#Channelquery').val();
        var request = gapi.client.youtube.search.list({
                q: q,
        type: 'channel',
                part: 'snippet', 
                maxResults: 25
        });
        request.execute(function(response)  {
                console.log(response)
                $('#results').empty()
        $("#search-results").html("Search Results");
                var srchItems = response.result.items;                      
                $.each(srchItems, function(index, item) {
                channelTitle = "<h4>"+item.snippet.channelTitle+"</h4>";  
                channelThumburl = item.snippet.thumbnails.default.url;
                id = item.id.channelId;
                channelThumbimg = '<img id="thumb" src="'+channelThumburl+'" alt="No  Image Available.">';                   

                $('#results').append("<a onclick='ChannelUploadId()'>" + channelTitle + "<br>" + channelThumbimg + "<br>" + "</a>")
        })  
    })  
}

     function ChannelUploadId(){
             var request = gapi.client.youtube.channels.list({id: id, part:'contentDetails'});
             request.execute(function(response){
                             console.log(response);
                     var srchItems = response.result.items;
                     $.each(srchItems, function(index, item) {
                     playlistId = item.contentDetails.relatedPlaylists.uploads;


             })
             ChannelUploads(playlistId);
     })
     }
     function ChannelUploads(i){
        console.log(i)

        var request = gapi.client.youtube.playlistItems.list({

             playlistId: i,
             type:'video',
             order:'date',
             part: 'snippet',
             maxResults: 25


     });
     request.execute(function(response){
                             console.log(response)
                   $('#results').empty()
                        $("#search-results").html("Search Results");
                var srchItems = response.result.items;                      
                $.each(srchItems, function(index, item) {
                vidTitle = "<h4>"+item.snippet.title+"</h4>";  
                vidThumburl = item.snippet.thumbnails.high.url;
                vidChannel = "<h4>"+item.snippet.channelTitle+"</h4>";
                vidPublish = "<h4>"+item.snippet.publishedAt+"</h4>";
                id = item.id.videoId;
                vidThumbimg = '<img id="thumb" src="'+vidThumburl+'" alt="No  Image Available.">';                   

                $('#results').append("<a onclick='getScreenshots("https://www.youtube.com/watch?v="+id+"")'>" + vidTitle + "<br>" + "Published: " +vidPublish + "<br>"+ "Channel: "+vidChannel + "<br>"+ vidThumbimg + "</a><hr>");                      
        })
     })

   }




     function keyWordsearch(){
        gapi.client.setApiKey('AIzaSyAhXRvLpBIyLlOQ9N0W6qUNNqNrhmQBovY')


        gapi.client.load('youtube', 'v3', function() {
                makeRequest();
        });
}
    function makeRequest() {
        var q = $('#query').val();
        var request = gapi.client.youtube.search.list({
                q: q,
        type: 'video',
                part: 'snippet', 
                maxResults: 25
        }); 
        request.execute(function(response)  {
                console.log(response)
                $('#results').empty()
                $("#search-results").html("Search Results");
                var srchItems = response.result.items;                      
                $.each(srchItems, function(index, item) {
                vidTitle = "<h4>"+item.snippet.title+"</h4>";  
                vidThumburl = item.snippet.thumbnails.high.url;
                vidChannel = "<h4>"+item.snippet.channelTitle+"</h4>";
                vidPublish = "<h4>"+item.snippet.publishedAt+"</h4>";
                id = item.id.videoId;
                vidThumbimg = '<img id="thumb" src="'+vidThumburl+'" alt="No  Image Available.">';                   

                $('#results').append("<a onclick='getScreenshots("https://www.youtube.com/watch?v="+id+"")'>" + vidTitle + "<br>" + "Published: " +vidPublish + "<br>"+ "Channel: "+vidChannel + "<br>"+ vidThumbimg + "</a><hr>");                      
        })  
    })  
}
  </script>
See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙；凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

Once you have the channel_id, change the highlighted letter as is shown:

Channel: Microsoft Hololens

Channel_id: UCT2rZIAL-zNqeK1OmLLUa6g

Uploads (playlist): UUT2rZIAL-zNqeK1OmLLUa6g

Once you have the uploads playlist, you can use this request for get the uploaded videos:

https://www.googleapis.com/youtube/v3/playlistItems?part=snippet%2CcontentDetails&playlistId=<UPLOAD_PLAYLIST_ID>&fields=items(contentDetails(videoId%2CvideoPublishedAt)%2Csnippet(publishedAt%2Ctitle))&key={YOUR_API_KEY}

And these are the results:

{
 "nextPageToken": "CAUQAA",
 "pageInfo": {
  "totalResults": 61,
  "resultsPerPage": 5
 },
 "items": [
  {
   "snippet": {
    "publishedAt": "2019-02-24T17:38:51.000Z",
    "title": "Industry Partner Solutions for Microsoft HoloLens 2"
   },
   "contentDetails": {
    "videoId": "FWYcuHUgcng",
    "videoPublishedAt": "2019-02-24T17:38:51.000Z"
   }
  },
  {
   "snippet": {
    "publishedAt": "2019-02-24T17:32:14.000Z",
    "title": "Introducing Microsoft HoloLens 2 (Audio Description)"
   },
   "contentDetails": {
    "videoId": "NtRGESjKT6M",
    "videoPublishedAt": "2019-02-24T17:32:14.000Z"
   }
  },
  {
   "snippet": {
    "publishedAt": "2019-02-24T17:31:30.000Z",
    "title": "Introducing Microsoft HoloLens 2"
   },
   "contentDetails": {
    "videoId": "eqFqtAJMtYE",
    "videoPublishedAt": "2019-02-24T17:31:30.000Z"
   }
  },
  {
   "snippet": {
    "publishedAt": "2019-02-24T17:39:08.000Z",
    "title": "PACCAR is exploring Dynamics 365 Guides and HoloLens 2 to improve employee onboarding"
   },
   "contentDetails": {
    "videoId": "OQDhTtDgir0",
    "videoPublishedAt": "2019-02-24T17:39:08.000Z"
   }
  },
  {
   "snippet": {
    "publishedAt": "2019-02-24T17:41:16.000Z",
    "title": "Introducing Dynamics 365 Guides for HoloLens 2"
   },
   "contentDetails": {
    "videoId": "V8c3pDKdHEc",
    "videoPublishedAt": "2019-02-24T17:41:16.000Z"
   }
  }
 ]
}

This is the Google API Explorer demo I made.

N.B, this channel has 61 uploaded videos and the maximun results per page are 50.

This is the entire working jsfiddle.


与恶龙缠斗过久,自身亦成为恶龙；凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界，一个免费开放的程序员编程交流平台！开放，进步，分享！让技术改变生活，让极客改变未来！ Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

Just Browsing Browsing

1.4m articles

1.4m replys

5 comments

57.0k users

Most popular tags

Snow Theme by Q2A Market
Powered by Question2Answer
...