JavaScript 快速入门

本快速入门指南介绍如何设置向 YouTube Data API 发出请求的简单页面。本快速入门实际上介绍了如何发出两个 API 请求:

  1. 您将使用用于标识您的应用的 API 密钥来检索有关 GoogleDevelopers YouTube 频道的信息。
  2. 您将使用 OAuth 2.0 客户端 ID 提交授权请求,以检索关于您自己的 YouTube 频道的信息。

前提条件

如需运行本快速入门,您需要:

  • Python 2.4 或更高版本(用于提供网络服务器)
  • 能够访问互联网和网络浏览器。
  • Google 帐号

第 1 步:设置项目和凭据

API 控制台中创建或选择项目。在 API 控制台中为您的项目完成以下任务:

  1. 库面板中,搜索 YouTube Data API v3。点击进入该 API 的列表,确保已为您的项目启用该 API。

  2. “凭据”面板中,创建两个凭据:

    1. 创建 API 密钥 您将使用 API 密钥发出不需要用户授权的 API 请求。例如,您无需用户授权即可检索公开 YouTube 频道的相关信息。

    2. 创建 OAuth 2.0 客户端 ID 将应用类型设为 Web 应用。对于需要用户授权的请求,您需要使用 OAuth 2.0 凭据。例如,您需要获得用户授权才能检索当前经过身份验证的用户的 YouTube 频道的相关信息。

      已获授权的 JavaScript 来源字段中,输入网址 http://localhost:8000。您可以将已获授权的重定向 URI 字段留空。

第 2 步:设置并运行示例

使用侧边栏中的 API Explorer 微件获取示例代码,以检索有关 GoogleDevelopers YouTube 频道的信息。此请求使用 API 密钥来标识您的应用,不需要用户授权或运行示例的用户获得任何特殊权限。

  1. 打开 API 的 channels.list 方法文档。
  2. 在该页的“常见用例”部分中,有一个表格介绍了该方法的几种常见用法。表格中的第一个商品详情是按频道 ID 列出的结果。

    点击第一个列表的代码符号,即可打开并填充全屏 API Explorer。

    用于标识渠道代码列表文档中表格内代码符号链接的位置的图片。该图片的替代文本会将图片标识为代码符号,并指定与该链接关联的用例。

  3. 全屏 API Explorer 的左侧显示以下内容:

    1. Request parameters 标头下方,列出了该方法支持的参数。应设置 partid 参数值。id 参数值 UC_x5XG1OV2P6uZZ5FSM9Ttw 是 GoogleDevelopers YouTube 频道的 ID。

    2. 参数下方有一个名为凭据的部分。该部分中的下拉菜单应该会显示值 API key。默认情况下,API Explorer 使用演示凭据,以便更轻松地上手使用。但您将使用自己的 API 密钥在本地运行示例。

      此图片显示了全屏 API Explorer 中的“凭据”和已选择“API 密钥”选项的下拉菜单。

  4. 全屏 API Explorer 的右侧显示了包含不同语言的代码示例的标签页。选择 JavaScript 标签页。

  5. 复制代码示例并将其保存到名为 example.html 的文件中。

  6. 在下载的示例中,找到 YOUR_API_KEY 字符串并将其替换为您在本快速入门第 1 步中创建的 API 密钥。

  7. 在您的工作目录中使用以下命令启动网络服务器:

    Python 2.x

    python -m SimpleHTTPServer 8000
    

    Python 3.x

    python -m http.server 8000
    
  8. 在浏览器中打开 example.html 文件。此外,还要打开浏览器的开发者工具,例如 Chrome 浏览器中的“开发者工具”。

    1. 点击页面上的加载按钮,加载适用于 JavaScript 的 Google API 客户端库。点击该按钮后,开发者控制台应显示一条备注,指明已加载 GAPI 客户端。

    2. 点击执行按钮以发送 API 请求。然后,开发者的控制台应显示 API 响应。

第 3 步:运行授权请求

在此步骤中,您将修改代码示例,使其检索有关您的 YouTube 频道的信息,而不是检索 GoogleDevelopers YouTube 频道。此请求需要获得用户授权。

  1. 返回到 API 的 channels.list 方法的文档。

  2. 在“常见用例”部分中,点击表中第三个列表的代码符号。该用例是针对“my channel”调用 list 方法。

  3. 同样,在全屏 API Explorer 的左侧,您会看到参数列表和凭据部分。不过,在检索有关 GoogleDevelopers 渠道的信息的示例中,有两项更改:

    1. 在参数部分,应将 mine 参数值设为 true,而不是设置 id 参数值。此命令指示 API 服务器检索当前已通过身份验证的用户的通道的相关信息。

    2. 凭据部分,下拉菜单中应选择 Google OAuth 2.0 选项。

      此外,如果您点击 Show scope 链接,则应勾选 https://www.googleapis.com/auth/youtube.readonly 范围。

      显示全屏 API Explorer 中的范围和已选择“Google OAuth 2.0”凭据使用选项的图片。

  4. 与上一个示例一样,选择 JavaScript 标签页,复制代码示例并将其保存到 example.html

    在代码中,找到 YOUR_CLIENT_ID 字符串并将其替换为您在本快速入门的第 1 步中创建的客户端 ID。

  5. 在您的工作目录中使用以下命令启动网络服务器:

    Python 2.x

    python -m SimpleHTTPServer 8000
    

    Python 3.x

    python -m http.server 8000
    
  6. 在浏览器中转到 http://localhost:8000/example.html 文件。 打开浏览器的开发者工具,例如 Chrome 浏览器中的“开发者工具”。

  7. 点击页面上的授权并加载按钮,以加载适用于 JavaScript 的 Google API 客户端库,并启动授权流程。系统应该会提示您授权该应用读取您的 YouTube 帐号中的数据。

    如果您授予权限,开发者控制台应显示表明登录成功且 API 客户端已加载的消息。

  8. 点击执行按钮以发送 API 请求。然后,开发者的控制台应显示 API 响应。

补充阅读材料