本頁面由 Cloud Translation API 翻譯而成。

JavaScript 快速入門導覽課程

本快速入門指南說明如何設定簡單的網頁，向 YouTube Data API 發出要求。本快速入門導覽課程實際上說明如何發出兩項 API 要求：

您將使用 API 金鑰 (用於識別應用程式)，擷取 GoogleDevelopers YouTube 頻道資訊。
您將使用 OAuth 2.0 用戶端 ID 提交「已授權」要求，以擷取自家 YouTube 頻道的相關資訊。

必要條件

如要執行這項快速入門導覽課程，您需要：

Python 2.4 以上版本 (提供網路伺服器)
可連上網際網路並具備網路瀏覽器。
Google 帳戶。

步驟 1：設定專案和憑證

在 API 控制台中建立或選取專案。在專案的 API 控制台中完成下列工作：

在程式庫面板中，搜尋 YouTube Data API v3。點選該 API 的清單，確認專案已啟用該 API。
在憑證面板中，建立兩項憑證：
1. 建立 API 金鑰：您將使用 API 金鑰發出不需要使用者授權的 API 要求。舉例來說，如要擷取公開 YouTube 頻道的資訊，不需要使用者授權。
2. 建立 OAuth 2.0 用戶端 ID 將應用程式類型設為「網頁應用程式」。對於需要使用者授權的要求，您必須使用 OAuth 2.0 憑證。舉例來說，您需要使用者授權，才能擷取目前已驗證使用者 YouTube 頻道的相關資訊。
  
  在「Authorized JavaScript origins」(已授權的 JavaScript 來源) 欄位中輸入網址 http://localhost:8000。您可以將「已授權的重新導向 URI」欄位留空。

步驟 2：設定及執行範例

使用側邊面板中的 APIs Explorer 小工具，取得用於擷取 GoogleDevelopers YouTube 頻道相關資訊的程式碼範例。這項要求會使用 API 金鑰識別您的應用程式，不需要使用者授權，也不需要執行範例的使用者提供任何特殊權限。

開啟 API 的 channels.list 方法說明文件。
該頁面的「常見用途」部分包含一個表格，說明這個方法常見的幾種用途。表格中的第一個項目是依頻道 ID 列出的結果。

按一下第一個項目的程式碼符號，開啟並填入全螢幕的 API Explorer。
全螢幕 API Explorer 的左側會顯示下列內容：
1. 「要求參數」標頭下方會列出方法支援的參數。請設定 part 和 id 參數值。id 參數值 UC_x5XG1OV2P6uZZ5FSM9Ttw 是 GoogleDevelopers YouTube 頻道的 ID。
2. 參數下方有一個名為「憑證」的部分。該專區的下拉式選單應會顯示「API 金鑰」值。API 探索工具預設會使用示範憑證，方便您輕鬆上手。但您會使用自己的 API 金鑰在本機執行範例。
全螢幕 API Explorer 的右側會顯示分頁，內含不同語言的程式碼範例。選取「JavaScript」JavaScript分頁標籤。
複製程式碼範例，並儲存至名為 example.html 的檔案。
在下載的範例中，找出 YOUR_API_KEY 字串，並替換為您在本快速入門導覽課程步驟 1 中建立的 API 金鑰。
從工作目錄使用下列指令啟動網頁伺服器：
Python 2.x
```
python -m SimpleHTTPServer 8000
```
Python 3.x
```
python -m http.server 8000
```
在瀏覽器中開啟 example.html 檔案。同時開啟瀏覽器的開發人員工具，例如 Chrome 瀏覽器的「開發人員工具」。
1. 按一下頁面上的「load」按鈕，載入 Google API JavaScript 用戶端程式庫。按一下按鈕後，開發人員控制台應會顯示附註，指出 GAPI 用戶端已載入。
2. 按一下「執行」按鈕，傳送 API 要求。開發人員的控制台隨後應會顯示 API 回應。

步驟 3：執行授權要求

在這個步驟中，您將修改程式碼範例，讓系統擷取您的 YouTube 頻道資訊，而非 GoogleDevelopers YouTube 頻道資訊。這項要求需要使用者授權。

返回 API 的 channels.list 方法說明文件。
在「常見用途」部分，按一下表格中第三個項目的程式碼符號。這個用途是為「我的頻道」呼叫 list 方法。
同樣地，在全螢幕 API Explorer 的左側，您會看到參數清單，後面接著「憑證」部分。不過，與您擷取 GoogleDevelopers 頻道資訊的範例相比，有兩項變更：
1. 在參數部分，mine 參數值應設為 true，而非設定 id 參數值。這會指示 API 伺服器擷取目前已驗證使用者頻道的相關資訊。
2. 在「憑證」部分，下拉式選單應選取「Google OAuth 2.0」選項。
  
  此外，如果點選「顯示範圍」連結，應會看到 https://www.googleapis.com/auth/youtube.readonly 範圍已勾選。
與上一個範例相同，選取「JavaScript」JavaScript分頁，複製程式碼範例，然後儲存至 example.html。

在程式碼中找出 YOUR_CLIENT_ID 字串，並替換為您在本快速入門導覽課程步驟 1 中建立的用戶端 ID。
從工作目錄使用下列指令啟動網頁伺服器：
Python 2.x
```
python -m SimpleHTTPServer 8000
```
Python 3.x
```
python -m http.server 8000
```
在瀏覽器中前往 http://localhost:8000/example.html 檔案。開啟瀏覽器的開發人員工具，例如 Chrome 瀏覽器的「開發人員工具」。
按一下網頁上的「授權並載入」按鈕，載入 JavaScript 適用的 Google API 用戶端程式庫，並啟動授權程序。系統應會提示您授予應用程式權限，允許讀取 YouTube 帳戶中的資料。

如果授予權限，開發人員控制台應會顯示訊息，指出登入成功，且 API 用戶端已載入。
按一下「執行」按鈕，傳送 API 要求。開發人員的控制台隨後應會顯示 API 回應。

JavaScript 快速入門導覽課程 透過集合功能整理內容 你可以依據偏好儲存及分類內容。