Tom*_*lén 5 youtube-api youtube-javascript-api angularjs
我想使用angularjs在我的移动应用中列出一堆来自YouTube的视频.我想要列出用户/频道特定播放列表的所有视频.
我从Google Developer Console获得了API KEY,但我不明白如何以及在何处使用它.在本文档中,他们只讨论了oauth方法.https://developers.google.com/youtube/v3/code_samples/javascript#authorizing_requests 我尝试直接使用该文档中的示例代码来获取消息,说明我必须首先进行身份验证.
我真的很感激这方面的一些帮助.如何使用api密钥进行身份验证,其次如何使用播放列表中的视频进行身份验证.
PS.我是一名新手开发人员,我正在使用angularjs和离子框架进行我的第一个学习项目.我是新出的Codeschool的css,jquery,javascript,backbone和angular的课程.DS.谢谢!
mpg*_*pgn 14
如果您想要频道的视频,则需要使用YouTube API V3.使用youtube.search.list
参数:
part=id, snippet
channelId=ID OF THE CHANNEL
order=date
type=video
如何查找YouTube频道的ID？
您可以使用http://mpgn.github.io/YTC-ID/找到频道名称与频道名称的ID
更多信息youtube.search.list权在这里.
这是一个现场演示.
此外,如果它是一个公共应用程序,您可能会感兴趣:如何保护我的公共API密钥？
这是获取频道视频的基本代码:
<!DOCTYPE html>
<html>
<head>
<script src="//code.jquery.com/jquery-2.1.1.min.js"></script>
<meta charset="utf-8">
<title>JS Bin</title>
</head>
<body>
<script>
function googleApiClientReady() {
var apiKey = 'your api key';
gapi.client.setApiKey(apiKey);
gapi.client.load('youtube', 'v3', function() {
request = gapi.client.youtube.search.list({
part: 'snippet',
channelId: 'UCqhNRDQE_fqBDBwsvmT8cTg',
order: 'date',
type: 'video'
});
request.execute(function(response) {
console.log(response);
});
});
}
</script>
<script src="https://apis.google.com/js/client.js?onload=googleApiClientReady"></script>
</body>
</html>
使用AngularJS,您需要创建一个服务'google',您可以在控制器中使用该服务.
示例示例:https://gist.github.com/jakemmarsh/5809963
您不需要具有身份验证的部分.deferred在这种情况下,使用很重要.
控制器中的示例
'use strict';
function init() {
window.initGapi(); // Calls the init function defined on the window
}
angular.module('team')
.controller('VideosCtrl', function ($scope, $window, $sce, googleService) {
$window.initGapi = function() {
$scope.$apply($scope.getChannel);
};
$scope.getChannel = function () {
googleService.googleApiClientReady().then(function (data) {
$scope.channel = data;
}, function (error) {
console.log('Failed: ' + error)
});
};
});
服务 googleService中的示例
.service('googleService', ['$http', '$q', function ($http, $q) {
var deferred = $q.defer();
this.googleApiClientReady = function () {
gapi.client.setApiKey('YOU API KEY');
gapi.client.load('youtube', 'v3', function() {
var request = gapi.client.youtube.playlistItems.list({
part: 'snippet',
playlistId: 'PLila01eYiSBjOtR8oqXkY0i5c1QS6k2Mu',
maxResults: 8
});
request.execute(function(response) {
deferred.resolve(response.result);
});
});
return deferred.promise;
};
}])
您需要将此行添加到index.html
<script src="https://apis.google.com/js/client.js?onload=init"></script>
希望它对你有所帮助!
您必须使用Google API 客户端库，以便gapi定义对象并且来自 google 的示例将起作用。将其包含在页面底部：
<script src="https://apis.google.com/js/client.js?onload=googleApiClientReady"></script>
然后定义回调，它将继续授权和您的逻辑：
googleApiClientReady = function() {
gapi.auth.init(function() {
// Other code following the example
});
}
一般来说，根据谷歌文档有
应用程序加载 JavaScript 客户端库。
该应用程序引用其 API 密钥，该密钥通过 Google 服务对应用程序进行身份验证。
如果应用程序需要访问用户的个人信息，它将打开与 Google 身份验证服务器的会话。身份验证服务器打开一个对话框，提示用户授权使用个人信息。
该应用程序加载 Google 服务的 API。
应用程序初始化一个请求对象（也称为服务对象），该对象指定 API 要返回的数据。
应用程序执行请求并处理 API 返回的数据。
这是基本 google API 授权流程的工作示例
| 归档时间： |
|
| 查看次数： |
13366 次 |
| 最近记录： |