youtube api v3 按关键字搜索 javascript

2024-04-30

谷歌开发人员页面上给出的“按关键字搜索”的 javascript 示例不适合我。https://developers.google.com/youtube/v3/code_samples/javascript https://developers.google.com/youtube/v3/code_samples/javascript当我运行代码时,我得到一个禁用的搜索框,里面有“猫”。此外,该示例没有解释如何写入 API 密钥(而不是客户端 ID)。它说这是可能的,但没有给出如何做到这一点的具体示例。有人能指出这段代码哪里出了问题吗?两个.js文件和html的代码如下:

auth.js 文件:

// The client ID is obtained from the Google Developers Console
// at https://console.developers.google.com/.
// If you run this code from a server other than http://localhost,
// you need to register your own client ID.
var OAUTH2_CLIENT_ID = '__YOUR_CLIENT_ID__';
var OAUTH2_SCOPES = [
  'https://www.googleapis.com/auth/youtube'
];

// Upon loading, the Google APIs JS client automatically invokes this callback.
googleApiClientReady = function() {
  gapi.auth.init(function() {
    window.setTimeout(checkAuth, 1);
  });
}

// Attempt the immediate OAuth 2.0 client flow as soon as the page loads.
// If the currently logged-in Google Account has previously authorized
// the client specified as the OAUTH2_CLIENT_ID, then the authorization
// succeeds with no user intervention. Otherwise, it fails and the
// user interface that prompts for authorization needs to display.
function checkAuth() {
  gapi.auth.authorize({
client_id: OAUTH2_CLIENT_ID,
scope: OAUTH2_SCOPES,
immediate: true
  }, handleAuthResult);
}

// Handle the result of a gapi.auth.authorize() call.
function handleAuthResult(authResult) {
 if (authResult && !authResult.error) {
// Authorization was successful. Hide authorization prompts and show
// content that should be visible after authorization succeeds.
$('.pre-auth').hide();
$('.post-auth').show();
loadAPIClientInterfaces();
} else {
// Make the #login-link clickable. Attempt a non-immediate OAuth 2.0
// client flow. The current function is called when that flow completes.
$('#login-link').click(function() {
  gapi.auth.authorize({
    client_id: OAUTH2_CLIENT_ID,
    scope: OAUTH2_SCOPES,
    immediate: false
    }, handleAuthResult);
  });
 }
}

// Load the client interfaces for the YouTube Analytics and Data APIs, which
// are required to use the Google APIs JS client. More info is available at
// http://code.google.com/p/google-api-javascript-client   /wiki/GettingStarted#Loading_the_Client
function loadAPIClientInterfaces() {
gapi.client.load('youtube', 'v3', function() {
handleAPILoaded();
 });
}

搜索.js 文件:

// After the API loads, call a function to enable the search box.
function handleAPILoaded() {
  $('#search-button').attr('disabled', false);
}

// Search for a specified string.
function search() {
  var q = $('#query').val();
  var request = gapi.client.youtube.search.list({
q: q,
part: 'snippet'
 });

 request.execute(function(response) {
var str = JSON.stringify(response.result);
$('#search-container').html('<pre>' + str + '</pre>');
 });
}

搜索.html

<!doctype html>
<html>
 <head>
<title>Search</title>
</head>
<body>
<div id="buttons">
  <label> <input id="query" value='cats' type="text"/><button id="search-button"  disabled onclick="search()">Search</button></label>
</div>
<div id="search-container">
</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="auth.js"></script>
<script src="search.js"></script>
<script src="https://apis.google.com/js/client.js?onload=googleApiClientReady">  </script>
</body>
</html>

该文档有点误导(甚至有人可能会说不正确); “按关键字搜索”的 HTML 正在加载与该页面上其他两个示例相同的“auth.js”,但它没有任何 HTML 元素来实际触发登录过程(即“登录按钮”) “如果用户尚未获得授权)就像其他两个示例一样。基本上,如果您使用提供的 auth.js,则需要在 HTML 中包含如下所示的部分:

<div id="login-container" class="pre-auth">
  This application requires access to your YouTube account.
  Please <a href="#" id="login-link">authorize</a> to continue.
</div>

然后,您还可以在围绕现有按钮和搜索容器的新 div 上添加“post-auth”类。然后,当用户访问时,演示将仅显示登录链接;当单击时,并且当用户允许授权时,登录链接将被隐藏,并且您的搜索区域将被显示(并且按钮被启用)。这就是演示的设置方式。

当然,按关键字搜索不需要 oAuth2,因此(回答你的第二个问题)你可能会发现更容易 A) 删除handleApiLoaded方法(这样你的按钮就永远不会被禁用),B)调用gapi.client.load()手动(即不是由 oAuth 成功触发)。然后,致电gapi.client.setApiKey({YOUR KEY})这样您的所有请求都会在其标头中包含您的密钥。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

youtube api v3 按关键字搜索 javascript 的相关文章

  • 如何在 Chrome 中创建 TouchEvent?

    The W3C规范 http www w3 org TR 2011 WD touch events 20110505 idl def TouchEvent宣称initTouchEvent如下 void initTouchEvent in D
  • 调用“DOMNodeInserted”事件时添加元素

    我想在每个 喜欢 按钮 chrome 扩展 之后添加一个元素 由于帖子被添加到新闻提要而不刷新页面 我必须添加一个事件侦听器 DOMNodeInserted 但是当我尝试把after 里面的功能 它不起作用 Code contentArea
  • 如何理解 Angular JS 中的控制台错误消息?有什么工具吗?

    我是 Angular JS 的新手 我的第一个问题是如何理解 Angular JS 中控制台的错误消息 我编写了这段用于匹配密码的代码片段 它在控制台上抛出错误 但它工作正常 它是有线的 我无法从这些控制台消息中理解任何内容 谁能指出我为什
  • 在 MongoDB 中查找具有字符串 ID 数组的文档

    我有一个 id 字符串数组 我想将其与 find 函数一起使用 db companies find id in arr arr看起来像这样 563a2c60b511b7ff2c61e938 563a2c60b511b7ff2c61e8b7
  • 如何将中间件绑定到socket.io中的事件

    现在您可以将中间件绑定到io use middleware 但这仅在建立套接字连接时触发 有没有办法在将其传递给事件句柄之前拦截它 就像在expressjs中一样 换句话说 In 快递 js你可以做 app get middleware1
  • ant-d upload中如何为removeFile添加PopConfirm一个图片文件

    我正在使用 Ant d Upload 通过本地系统上传文件 然后单击文件预览图像上的删除图标 图像文件将被删除 我想添加一个弹出确认 所以我尝试在 onRemovefunction 中添加确认作为承诺但它不起作用 它在浏览器中显示警报 on
  • 将音频与视频流合并 Node.js

    我正在创建 YouTube 视频下载器并且正在使用ytdl core库 它无法下载带有音频的高质量视频 因为 youtube 将其放在另一个文件中 但我需要将其全部下载到一个文件中 我已经这样做了 app get download asyn
  • 创建 Cookie 时需要帮助

    我有一个名为yes和另一个名叫no
  • ElectronJS ReferenceError:导航器未定义

    我正在尝试在电子上制作自定义标题栏 但是当我启动我的应用程序时 我遇到了 ReferenceError 导航器未定义 问题 请帮忙 这是我的 main js 中的代码片段 My Codes https i stack imgur com c
  • iframe 重新加载按钮

    我浏览了很多网站 但似乎没有一个能正常工作 或者我不明白它们 我想要一个刷新某个 iframe 的简单按钮 该按钮将位于父页面上 并且 iframe 名称为 Right 有很多方法可以做到这一点 假设这个iframe markup 我们可以
  • v-file-input .click() 不是函数

    我试图以编程方式触发 v file input 的 click 事件 因为它在 Vuetify 的文档中 但它显示一个错误this refs imagePicker click is not a function我在这里错过了什么吗 代码重
  • KeyboardEvent.keyCode 已弃用。这在实践中意味着什么?

    根据 MDN 我们绝对应该not正在使用 keyCode财产 它已被弃用 https developer mozilla org en US docs Web API KeyboardEvent keyCode https develope
  • 访问 TypeScript 数组的最后一个元素

    TypeScript 中有访问数组最后一个元素的符号吗 在 Ruby 中我可以说 array 1 有类似的东西吗 您可以通过索引访问数组元素 数组中最后一个元素的索引将是数组的长度 1 因为索引是从零开始的 这应该有效 var items
  • 使水平滚动条始终可见,即使底部不在视图中

    我将用一个片段来开始这个问题 该片段几乎显示了我想要完成的任务 wrapper overflow hidden display flex sidebar min width 200px background 333 color FFF co
  • window.showModalDialog 的等效跨浏览器解决方案是什么?

    window showModalDialog 的等效跨浏览器解决方案有哪些 showModalDialog 在 IE 和 FF 3 中引入 我个人认为没有 但是有很多 UI 工具包提供了这样的功能 例如jQuery UI http jque
  • 需要js、d3 和 nvd3 集成

    我面临整合的问题要求 questions tagged requirejs with d3 questions tagged d3 and nvd3 questions tagged nvd3 我找到了一个使用 require 的简单解决方
  • 如何获取使用 .map 渲染的第一个元素的 ref?

    我需要在几行中显示视频 卡片 的缩略图 并重点关注第一个缩略图 我使用嵌套地图进行了显示 该代码基本上迭代视频数组并返回多行视频 我们如何关注第一个渲染的元素 我认为我们需要获得第一个要聚焦的元素的引用 但是我们如何在这里设置 ref 并在
  • 替换两个引号之间的字符串

    我想转动一根绳子str hello my name is michael what s your s into hello my name is span class name michael span 我怎样才能在 JavaScript
  • Express.js Passport认证自动失败跳过策略

    UPDATE 我已将代码从护照本地注册内部移至单独的处理程序 并且运行良好 问题在于 Passport 和本地注册的使用 但我不知道为什么 我使用 Node js Express Passport 进行身份验证和注册设置 这是以前使用过的标
  • Bootstrap 3 / 显示模式不适用于 javascript 方式

    我用Modal http getbootstrap com javascript modalsBootstrap 3 0 的功能 我有这个代码 a href myNestedContent Open the modal containing

随机推荐

  • 使用 RSpec 测试模块内的类

    所以 我的 ruby 代码中有一个模块 如下所示 module MathStuff class Integer def least factor implementation code end end end 我有一些 RSpec 测试 我
  • 如何在 iOS 中打开 URL 而不指定 HTTP 或 HTTPS?

    在我的 iOS 应用程序中 我使用以下代码打开链接 UIApplication sharedApplication openURL NSURL URLWithString NSString stringWithFormat myurl 链接
  • 如何使用我的服务器作为代理通过 PHP 下载文件?

    我需要我的服务器充当第三方服务器 文件最初所在的位置 和最终用户之间的代理 也就是说 我的服务器从第3方服务器下载文件 然后用户从我的服务器下载它 这将导致产生文件大小两倍的带宽 这个过程如何使用PHP来实现呢 fp fopen url r
  • 如何测试具有多个输入调用的循环?

    我正在尝试测试一个依赖多个用户输入来返回某个值的函数 我已经在这里寻找了多个答案 但没有一个能够解决我的问题 我看到了参数化 模拟和猴子补丁的东西 但没有任何帮助 我认为很大程度上是因为我没有清楚地理解正在做的事情背后的概念 并且我无法适应
  • 如何在python中修改html树?

    假设有一些可变片段html代码 p span class code string 1 span class code string 2 span class code string 3 span span span p p span cla
  • ftplib: 在 LIST 期间/之后出现 socket.error // ssl._sslobj.shutdown() / 连接超时

    我尝试使用客户端证书连接到 FTPS 服务器 我尝试了两台不同的服务器 我无法控制它们 但应该非常相似 连接建立 PWD 命令成功 在一台服务器上 LIST 命令成功 但在第二台服务器上 它产生正确的结果 文件列表 但之后 显然在 SSL
  • 在 Android 中移动目录的最快方法?

    在 Android 中移动目录最快的方法是什么 在大多数情况下 但并非所有情况 源和目标位于同一 SD 卡文件系统上 目前 我的代码遍历整个目录结构 并将每个文件的内容复制到新位置的同名新文件中 然后它会验证文件大小是否匹配 然后删除源文件
  • 如何自定义 magento onepage 结账表单

    我正在使用 Magento 1 5 1 0 我想在单页结账表单中自定义地址块 我想删除 传真 输入字段并将 区域 下拉列表放在国家 地区 下拉列表 下方 这个形式是在哪里定义的 亲切的问候 伯蒂 导航到您的主题文件夹 默认文件位于以下位置
  • 大师系统要求

    我们将使用 Virtuoso 来存储 RDF 三重计数一开始将为 1 亿 我需要知道典型的 RAM CPU 磁盘等应该是什么 查询将使用 SPARQL 并且查询会有点复杂 请提供您的意见 Virtuoso 版本 6 x 三元组 四元组 的平
  • JAVA - 路径问题(在 Eclipse 中有效,在 cmd 中无效)

    为什么下面的启动在 Eclipse 中有效 private static MaxentTagger maxentTagger new MaxentTagger c DP lemma models english left3words dis
  • phonegap、iphone 和最大的坏处idleTimerDisabled

    阅读了很多关于如何防止 iPhone 在运行我的应用程序时进入睡眠状态的内容 我现在非常不高兴 因为没有任何效果 here https stackoverflow com questions 1058717 idletimerdisable
  • Internet Explorer 无法打开 Internet 站点操作中止,如何修复此错误?

    此代码在 IE 中给出错误 Internet Explorer 无法打开 Internet 站点操作中止 如何修复此错误 var tip p Most computers will open PDF documents tip automa
  • 在 pyspark 中实现递归算法以查找数据帧中的配对

    我有一个火花数据框 prof student df 列出了时间戳的学生 教授对 每个时间戳有 4 位教授和 4 位学生 每个教授 学生对都有一个 分数 因此每个时间范围有 16 行 对于每个时间范围 我需要找到教授 学生之间的一对一配对 以
  • pandas - 扩展 DataFrame 的索引,将新行的所有列设置为 NaN?

    我有时间索引的数据 df2 pd DataFrame day pd Series date 2012 1 1 date 2012 1 3 b pd Series 0 22 0 3 df2 df2 set index day df2 b da
  • 在 Vim 中搜索并替换为递增值

    假设我写了一个简单的 CSS 规则 如下所示 star 10 background url stars png no repeat 0 0 而我需要10个 所以我复制了9次 star 10 background url stars png
  • d3.js:在树布局中展开多个路径

    My JSON contains same node names in different paths I would like to be able to open all children with the same name or h
  • AmazonDB 免费套餐的含义是什么?

    在我的 Android 应用程序中 我使用 Amazon DynamoDB 我创建了 10 个表 读取容量为 10 写入容量为 5 今天我收到了一封来自 Amazon 的电子邮件 我花了 11 36 美元 我不明白免费套餐的含义 这是我从亚
  • 隐藏控制台窗口

    problem 我开始使用 Python 和 Tkinter 设计 GUI 应用程序 当我使用 cxFreeze 冻结脚本时 然后当我在计算机上运行该 EXE 文件时 然后首先打开控制台窗口 在 Windows XP 中为黑色 DOS sh
  • 广播接收器在不同版本的 Android(4.1.1 和 4.2.2)上的工作方式有所不同

    我有一个问题 当我运行我的 Android 应用程序时 它有广播接收器 for WiFi 它在不同版本的 Android 操作系统上表现不同 例如4 1 1 and 4 2 2 当我运行它时4 1 1它工作完美 就像广播接收器在 Wifi
  • youtube api v3 按关键字搜索 javascript

    谷歌开发人员页面上给出的 按关键字搜索 的 javascript 示例不适合我 https developers google com youtube v3 code samples javascript https developers