PHP TUTORIALS
Hướng dẫn tạo domain ảo tại localhost với XAMPP trên Window Có gì mới trong PHP 8 (Tính năng, Cải tiến và Trình biên dịch JIT) Hướng dẫn viết ứng dụng kiểm tra năm sinh theo âm lịch bằng PHP Xử lý realtime trong PHP sử dụng pusher Hướng dẫn gửi mail trong PHP với PHPMailer Bóc tách dữ liệu từ trang khác bằng PHP Simple HTML DOM Parser Cách sửa lỗi hình ảnh khi đăng bài viết lên Facebook Hướng dẫn tạo thông báo realtime với pushcrew Kích thước chuẩn và cách làm FavIcon icon Tìm hiểu bản chất vòng lặp foreach trong php Những vấn đề nâng cao kỹ năng lập trình trong php Sử Dụng Vòng Lặp Xuất Dữ Liệu Bảng Tính Lương Tìm hiểu thuật toán phân trang trong php Giới hạn số trang trong thuật toán phân trang Bài 01: Đệ quy menu đa cấp với php và mysql - phần 1 Bài 02: Đệ quy menu đa cấp với php và mysql - phần 2 Tích hợp bộ search google vào website Nên dùng count() hay sizeof() để đếm số phần tử của mảng Bài 01: Lấy dữ liệu từ mysql lưu vào file excel với PHPExcel Tạo slug tự động bằng JavaScript và PHP RSS là gì? Cách Tạo RSS cho Website PHP CMS là gì? Các CMS phổ biến hiện nay (update 2021) Web động là gì? Web tĩnh là gì? Chặn referrer từ website simple-share-buttons.com Bảng mã ASCII chuẩn các hệ nhị phân - thập phân - thập lục phân Hướng dẫn tạo Facebook App để lấy App ID và Secret Key Mối liên hệ giữa HTML - PHP - MYSQL Tự động post bài viết lên tường với hootsuite.com Kiểm tra người dùng đã đăng nhập hay chưa bằng PHP Lấy video kênh Youtube mới nhất bằng jQuery và Youtube API V3 Đệ quy chuyên mục đa cấp trong PHP toàn tập Font Awesome là gì? Cách sử dụng Font Awesome Tích hợp đăng nhập Google vào Website Thuật toán phân trang với PHP và MySQL Cài đặt LAMP trên Fedora
CÁC CHỦ ĐỀ
BÀI MỚI NHẤT
Dự án mới của mình là gamehow.net, mời anh em ghé thăm và góp ý ạ.

Lấy video kênh Youtube mới nhất bằng jQuery và Youtube API V3

Trong bài này mình sẽ hướng dẫn bạn cách sử dụng Youtube API V3 và jQuery để lấy danh sách video mới nhất được đăng tải trên kênh của các bạn. Chúc năng này rất hữu ích nếu bạn có website và có kênh riêng cho website đó.

Ngay freetuts cũng có chức năng này, bạn thử vào và sẽ thấy có một Popup nằm phía bên trái khi click vào sẽ hiển thị danh sách video mới nhất đăng trên kênh Youtube.

banquyen png
Bài viết này được đăng tại freetuts.net, không được copy dưới mọi hình thức.

youtube video latest freetuts net png

Để làm được điều này chúng ta phải thực hiện các bước như sau:

  • Bước 1: Đăng ký Google API để lấy API Key.
  • Bước 2: Lấy video Upload ID.
  • Bước 3: Dựa vào video Upload ID lấy danh sách video.

Để làm được chức năng này ban phải biết ajax, đặc biệt là phương thức GET jQuery Ajax.

1. Các bước lấy Video mới nhất từ Youtube

Đăng ký Google API để lấy API Key:

Mình đã có một bài hướng dẫn rồi đó là bài đăng ký google API, bạn tới bài đó đọc theo hướng dẫn ở phần một (đăng ký theo giao diện mới) nhé.

Lấy Video Upload ID:

Bạn sử dụng jQuery Ajax request đến URL https://www.googleapis.com/youtube/v3/channels bằng phương thức GET và kèm các tham số như sau:

  • part : contentDetails
  • id : id kênh của bạn
  • key : API key mà bạn đã đăng ký

Ví dụ:

// Get Youtube Video Upload ID
$.get("https://www.googleapis.com/youtube/v3/channels", {
        part : "contentDetails",
        id : "youtube_id",
        key : "api_key"
    },
    function(data){
        // Kết quả data là một Object như hình phía dưới
    }
);

Kết quả nó trả về là một Object như sau:

get video upload latest youtube png

Lúc này ta phải lặp qua item để lấy trường upload mà mình đã bôi xanh trong hình.

// Get Youtube Video Upload ID
$.get("https://www.googleapis.com/youtube/v3/channels", {
        part : "contentDetails",
        id : "chanel_id",
        key : "api_key"
    },
    function(data){
        $.each(data.items, function(i, item){
            var id = item.contentDetails.relatedPlaylists.uploads;
            // Xử lý tiếp - lấy danh sách video
        });
    }
);

Dựa vào video Upload ID lấy danh sách video:

Trong vòng lặp each trên ta sẽ viết code Ajax request đến https://www.googleapis.com/youtube/v3/playlistItems bằng phương thức GET với các tham số:

  • part : snippet
  • maxResults : số video muốn lấy
  • playlistId : id
  • key : api_key

Và lúc này kết quả nó sẽ trả về dạng như sau:

snippet get video latest from youtube png

Lúc này ta lặp qua items và dữ liệu cần lấy sẽ nằm trong items[i].snippet.

// Get Youtube Video Upload ID
$.get("https://www.googleapis.com/youtube/v3/channels", {
        part : "contentDetails",
        id : "chanel_id",
        key : "api_key"
    },
    function(data)
    {
        $.each(data.items, function(i, item)
        {
            // Upload ID
            var id = item.contentDetails.relatedPlaylists.uploads;
            
            $.get("https://www.googleapis.com/youtube/v3/playlistItems", {
                    part : "snippet",
                    maxResults : "50",
                    playlistId  : id,
                    key : "api_key"
                },
                function(result){
                    var output = '';
                    $.each(result.items, function(i, result_item){
                        output += '<div>';
                            var title = result_item.snippet.title;
                            var href = result_item.snippet.resourceId.videoId;
                            var img = result_item.snippet.thumbnails.default.url;
                            output += '<img src="'+img+'" />';
                            output += '<div><a href="https://www.youtube.com/watch?v='+href+'" title="'+title+'">'+title+'</a></div>';
                        output +='</div>';
                    });
                    // Gán danh sách video vào body
                    $('body').html(output);
                }
            );
        });
    }
);

Như vậy là bạn đã thành công trong việc lấy video mới nhất từ kênh Youtube của bạn rồi đấy.

2. Ví dụ lấy video kênh của freetuts.net

Kênh freetuts.net có ID là UCg9QhTft6SFstWk67JlJiEA và API Key là AIzaSyBdJxvaeQKFaQoqcc36mJmqTv_J_BMCMFE.

Lúc này code sẽ như sau:

Ví dụ: XEM DEMO

<!DOCTYPE html>
<html>
    <head>
        <title>Video YOUTUBE Latest</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <script src="https://freetuts.net/public/javascript/jquery.min.js" ></script>
        <script language="javascript">
            $(document).ready(function()
            {
                var chanel_id = 'UCg9QhTft6SFstWk67JlJiEA';
                var api_key  = 'AIzaSyBdJxvaeQKFaQoqcc36mJmqTv_J_BMCMFE';
                
                // Get Youtube Video Upload ID
                $.get("https://www.googleapis.com/youtube/v3/channels", {
                        part : "contentDetails",
                        id : chanel_id,
                        key : api_key
                    },
                    function(data)
                    {
                        $.each(data.items, function(i, item)
                        {
                            // Upload ID
                            var id = item.contentDetails.relatedPlaylists.uploads;

                            $.get("https://www.googleapis.com/youtube/v3/playlistItems", {
                                    part : "snippet",
                                    maxResults : "50",
                                    playlistId  : id,
                                    key : api_key
                                },
                                function(result){
                                    var output = '';
                                    $.each(result.items, function(i, result_item){
                                        output += '<div>';
                                            var title = result_item.snippet.title;
                                            var href = result_item.snippet.resourceId.videoId;
                                            var img = result_item.snippet.thumbnails.default.url;
                                            output += '<img src="'+img+'" />';
                                            output += '<div><a href="https://www.youtube.com/watch?v='+href+'" title="'+title+'">'+title+'</a></div>';
                                        output +='</div>';
                                    });
                                    // Gán danh sách video vào body
                                    $('body').html(output);
                                }
                            );
                        });
                    }
                );
            });
        </script>
    </head>
    <body>
        
    </body>
</html>

3. Lời kết

Việc lấy danh sách video này nếu không tìm hiểu kỹ sẽ rất khó lấy bởi nó phải thông qua hai giai đoạn, vì vậy bạn hãy xem kỹ video để viết theo sẽ dễ dàng hơn.

Cùng chuyên mục:

Hàm key_exists() trong PHP

Hàm key_exists() trong PHP

Cách sử dụng key_exists() trong PHP

Hàm mysqli_fetch_row() trong PHP

Hàm mysqli_fetch_row() trong PHP

Cách sử dụng mysqli_fetch_row() trong PHP

Hàm end() trong PHP

Hàm end() trong PHP

Cách sử dụng end() trong PHP

Hàm mysqli_field_count() trong PHP

Hàm mysqli_field_count() trong PHP

Cách sử dụng mysqli_field_count() trong PHP

Hàm count() trong PHP

Hàm count() trong PHP

Cách sử dụng count() trong PHP

Hàm mysqli_field_seek() trong PHP

Hàm mysqli_field_seek() trong PHP

Cách sử dụng mysqli_field_seek() trong PHP

Hàm compact() trong PHP

Hàm compact() trong PHP

Cách sử dụng compact() trong PHP

Hàm mysqli_field_tell() trong PHP

Hàm mysqli_field_tell() trong PHP

Cách sử dụng mysqli_field_tell() trong PHP

Hàm array_values() trong PHP

Hàm array_values() trong PHP

Cách sử dụng array_values() trong PHP

Hàm mysqli_free_result() trong PHP

Hàm mysqli_free_result() trong PHP

Cách sử dụng mysqli_free_result() trong PHP

Hàm array_unshift() trong PHP

Hàm array_unshift() trong PHP

Cách sử dụng array_unshift() trong PHP

Hàm mysqli_get_charset() trong PHP

Hàm mysqli_get_charset() trong PHP

Cách sử dụng mysqli_get_charset() trong PHP

Hàm array_shift() trong PHP

Hàm array_shift() trong PHP

Cách sử dụng array_shift() trong PHP

Hàm mysqli_get_client_stats() trong PHP

Hàm mysqli_get_client_stats() trong PHP

Cách sử dụng mysqli_get_client_stats() trong PHP

Hàm array_unique() trong PHP

Hàm array_unique() trong PHP

Cách sử dụng array_unique() trong PHP

Hàm mysqli_get_client_version() trong PHP

Hàm mysqli_get_client_version() trong PHP

Cách sử dụng mysqli_get_client_version() trong PHP

Hàm array_uintesect() trong PHP

Hàm array_uintesect() trong PHP

Cách sử dụng array_uintesect() trong PHP

Hàm mysqli_get_connection_stats() trong PHP

Hàm mysqli_get_connection_stats() trong PHP

Cách sử dụng mysqli_get_connection_stats() trong PHP

Hàm array_sum() trong PHP

Hàm array_sum() trong PHP

Cách sử dụng array_sum() trong PHP

Hàm mysqli_get_host_info() trong PHP

Hàm mysqli_get_host_info() trong PHP

Cách sử dụng mysqli_get_host_info() trong PHP

Top