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 만들기 애플리케이션 유형을 웹 애플리케이션으로 설정합니다. 사용자 승인이 필요한 요청에는 OAuth 2.0 사용자 인증 정보를 사용해야 합니다. 예를 들어 현재 인증된 사용자의 YouTube 채널에 관한 정보를 가져오려면 사용자 승인이 필요합니다.

      승인된 JavaScript 원본 필드에 URL http://localhost:8000를 입력합니다. 승인된 리디렉션 URI 필드는 비워두어도 됩니다.

2단계: 샘플 설정 및 실행

측면 패널의 API 탐색기 위젯을 사용하여 GoogleDevelopers YouTube 채널에 관한 정보를 가져오는 샘플 코드를 가져옵니다. 이 요청은 API 키를 사용하여 애플리케이션을 식별하며, 사용자 승인이나 샘플을 실행하는 사용자의 특별한 권한이 필요하지 않습니다.

1. API의 channels.list 메서드에 관한 문서를 엽니다.

2. 해당 페이지의 '일반적인 사용 사례' 섹션에는 이 메서드가 사용되는 여러 일반적인 방법을 설명하는 표가 포함되어 있습니다. 표의 첫 번째 항목은 채널 ID별 목록 결과입니다.

   첫 번째 목록의 코드 기호를 클릭하여 전체 화면 API 탐색기를 열고 채웁니다.

   

3. 전체 화면 API 탐색기의 왼쪽에는 다음이 표시됩니다.

   1. 요청 매개변수 헤더 아래에는 메서드에서 지원하는 매개변수 목록이 있습니다. part 및 id 매개변수 값을 설정해야 합니다. id 매개변수 값인 UC_x5XG1OV2P6uZZ5FSM9Ttw은 GoogleDevelopers YouTube 채널의 ID입니다.

   2. 매개변수 아래에 인증 정보라는 섹션이 있습니다. 이 섹션의 풀다운 메뉴에는 API 키 값이 표시되어야 합니다. API 탐색기는 기본적으로 데모 사용자 인증 정보를 사용하여 시작하기 쉽게 합니다. 하지만 샘플을 로컬로 실행하려면 자체 API 키를 사용해야 합니다.

      

4. 전체 화면 API 탐색기의 오른쪽에는 다양한 언어로 된 코드 샘플이 있는 탭이 표시됩니다. 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단계: 승인된 요청 실행

이 단계에서는 GoogleDevelopers YouTube 채널에 관한 정보를 가져오는 대신 내 YouTube 채널에 관한 정보를 가져오도록 코드 샘플을 수정합니다. 이 요청에는 사용자 승인이 필요합니다.

1. API의 channels.list 메서드 문서로 돌아갑니다.

2. '일반적인 사용 사례' 섹션에서 표의 세 번째 목록에 있는 코드 기호를 클릭합니다. 이 사용 사례는 '내 채널'에 대해 list 메서드를 호출하는 것입니다.

3. 전체 화면 API 탐색기의 왼쪽에는 매개변수 목록과 사용자 인증 정보 섹션이 표시됩니다. 하지만 GoogleDevelopers 채널에 관한 정보를 가져온 예시와는 두 가지 차이점이 있습니다.

   1. 매개변수 섹션에서 id 매개변수 값이 설정되는 대신 mine 매개변수 값이 true로 설정되어야 합니다. 이렇게 하면 API 서버가 현재 인증된 사용자의 채널에 관한 정보를 가져오도록 지시합니다.

   2. 사용자 인증 정보 섹션의 풀다운 메뉴에서 Google OAuth 2.0 옵션을 선택해야 합니다.

      또한 범위 표시 링크를 클릭하면 https://www.googleapis.com/auth/youtube.readonly 범위가 선택되어 있어야 합니다.

      

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 응답이 표시됩니다.

추가 자료

• Google Developers Console 도움말 문서
• JavaScript용 Google API 클라이언트 라이브러리 문서
• YouTube Data API 참조 문서