大佬教程收集整理的这篇文章主要介绍了如何在angularjs中使用API KEY和在播放列表中列出视频?,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我从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.
谢谢!
如果您想要频道的视频,则需要使用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的更多信息,请致电here.
这是live demo.
2.用Javascript?
>首先,您需要在console.google.developers创建一个项目.
>启用API YouTube API V3(设置为开).
>在凭证部分中,创建公共访问密钥.
此外,如果它是一个公共应用程序,您可能会感兴趣:How to protect my public API key ?
<!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>
3.使用AngularJS?
使用AngularJS,您需要创建一个服务’google’,您可以在控制器中使用该服务.
示例示例:https://gist.github.com/jakemmarsh/5809963
您不需要具有身份验证的部分.
在这种情况下,使用延迟很重要.
控制器中的示例
'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',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>
希望它对你有所帮助!
以上是大佬教程为你收集整理的如何在angularjs中使用API KEY和在播放列表中列出视频?全部内容,希望文章能够帮你解决如何在angularjs中使用API KEY和在播放列表中列出视频?所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。