Home IT/WEB youtube api key 발급방법 및 블로그에 유튜브 재생리스트 출력방법

youtube api key 발급방법 및 블로그에 유튜브 재생리스트 출력방법

Youtube api key 발급

얼마전 유튜브 채널을 개설했고 블로그에도 Youtube 채널에 올려둔 영상을 출력을 하기 위해서는 Youtube Api Key 를 발급받아야 출력이 가능하다. 아래 사이트에서에서 발급 받을 수 있다. 저는 크롬으로 구글 계정에 로그인하여 사용하기 때문에 큰 인증 없이 접속이 가능했다.

inline ad

구글 APIs : https://console.developers.google.com

프로젝트 생성

우선 새 프로젝트를 생성한다.

프로젝트 이름에는 youtube 라고 적었고 위치는 따로 설정하지 않았다. 만들기 버튼을 클릭하시면 youtube 라는 프로젝트가 생성된다.

프로젝트 생성후 프로젝트 선택 링크를 클릭하여 프로젝트 세부 설정으로 들어간다.

API및 서비스 사용 설정 링크를 클릭한다.

YouTube Data API v3

Google APIs 에서는 여러가지의 api 를 제공하는데 youtube 라고 검색하여 YouTube Data API v3 을 선택한다.

YouTube Data API v3는 동영상, 재생 목록 및 채널과 같은 YouTube 데이터에 대한 액세스를 제공하는 API 이다. 더 자세한 내용을 확인 하시고 사용하고자 하시는 분들은 아래 링크 가이드 문서를 참고하시면 된다.

가이드문서 : https://developers.google.com/youtube?hl=ko

Youtube Data API v3 사용 버튼을 클릭한다.

API 를 사용하려면 사용자 인증 정보를 추가해야한다. 사용자 인증 정보 메뉴 클릭 > 사용자 인증정보 만들기 > API 키 링크를 순서대로 클릭한다.

API 키가 생성되었다. 이 키를 우선 복사해서 keep 해둔다.

이후 생성된 API 키 목록에 API 키 1개 링크를 클릭한다. 이곳에서 API 키 제한 및 이름 변경을 할 수 있다.

API 를 발급 후 이 키가 다른 애플리케이션에서 사용되지 않도록 제한을 설정하는 부분인데 HTTP 리퍼러(웹사이트) 에서만 동작하고 싶으시면 해당 사이트를 추가하면 됩니다. 저는 블로그에만 사용할 예정이고 크게 제한사항을 안걸어두어도 될 거 같아 없음이라고 선택했습니다. 이 api 키로는 Youtube Data API v3 에서만 사용되도록 키 제한을 걸어두었습니다.

이제 설정이 다 되었고 api 를 사용하시면 됩니다.

할당량

YouTube Data API는 할당량만큼 사용이 가능합니다. 일일 10,000 쿼리를 사용할 수 있으며 어떠한 작업마다 다른 쿼리를 소비 할 수 있으니 아래 문서 참고하셔서 잘 사용하셔야 합니다. 사용자가 많은 사이트의 경우 10,000 할당량은 금방 소비가 됩니다. 저의 사이트는 주말에는 별로 들어오지 않아서 100 도 사용 안했는데 월요일에는 얼마나 소비가 될 지 확인해 봐야겠습니다.

https://developers.google.com/youtube/v3/getting-started?hl=ko

할당량 이름한도
Queries /일10,000 
Queries /분 /사용자 180,000 
Queries /분1,800,000 

아래 문서 참고하시면 유튜브 할당량 증설하는 방법이 있는데 할당량 늘리는 방법도 쉽지 없습니다.
https://brunch.co.kr/@joypinkgom/104

블로그에서 youtube 피드 출력

제 블로그는 wordpress CMS 를 사용하고 있으며 뉴스페이퍼(newspaper)라는 theme 를 사용하고 있습니다. 뉴스페이퍼는 쉽게 피드를 출력하는 도구가 있습니다. 우선 추가하고자 하는 페이지에서 Edit with TagDiv Composer 를 이용하여 Youtube 를 추가해봅시다.

Video 관련해서는 Vimeo 와 Youtube 를 추가할 수 있는 컴포넌트가 있습니다. Video Playlist 를 선택해서 원하는 위치에 배치합니다.

배치 후 아래와 같은 메시지가 출력되었네요. Theme Panel > Social Networks > YouTube API Configuration 경로에 조금전에 Youtube api Key 를 추가하면 될 거 같습니다.


a Youtube API key has net been provided. Go to Theme Panel > Social Networks > YouTube API Configuration

아래 사진과 같이 api key 를 추가해두었습니다.

이제는 아래의 메시지가 출력되었습니다. youtube playlist 에 설정이 안되어 있어서 그렇습니다.
Channel ID field is empty. Configure this block/widget and enter a youtube channel id

여러가지 출력 옵션들이 존재하지만 저는 Playlist id 를 통해 youtube 피드를 출력했습니다.
Playlist 가 없어서 부랴부랴 playlist 를 생성해서 넣어주었습니다.

Youtube 재생목록 만들기, 재생목록(playlist) id 확인

Youtube 스튜디오 메뉴로 들어와서 재생목록 메뉴를 클릭합니다.
이후 새 재생목록을 클릭하여 재생목록을 생성합니다. 저는 walk tour 라고 생성했습니다.

이제 동영상 세부정보로 들어가서 재생목록에 추가하면 됩니다.

다시 Youtube 스튜디오 메뉴 > 채널 재생목록 메뉴로 들어와서 조금 전에 추가한 재생목록을 클릭하고 해당 페이지의 URL 을 확인합니다. playlist?list= 이후의 텍스트가 Playlist id 입니다.

이제 정상적으로 Youtube 피드가 출력된 것을 확인하실 수 있습니다.

제 유튜브 채널 이름은 walk tour 이고 URL 은 https://studio.youtube.com/channel/UCuAHzkHgPKGfXIy_xqGgE5A 이곳 입니다. 제주의 아름다운 자연 경관이나 관광지를 산책하면서 소소하게 영상을 촬영하고 있습니다. 이글을 보신 분들은 꼭 찾아오셔서 구독과 좋아요 부탁드립니다. ^^ 구독자가 현재 31명이에요. 제발 도와주세요 🙏🙏

RECENT POSTS

[javscript]API 응답에서 키 값들을 검증하는 방법

API 응답에서 다수의 키 값들을 검증할 때 코드의 중복을 줄이는 것은 유지보수성을 향상시키고, 가독성을 높이는 데 중요합니다. 이를 위해 몇 가지 접근 방법을 사용할...

[javscript]특정 키를 제외하고 두 객체를 비교하는 방법

특정 키를 제외하고 두 객체를 비교하는 작업은 데이터의 동등성을 평가하고 싶을 때 유용합니다. Lodash 라이브러리를 통해서 처리할 수 있는 방법에 대해서 살펴보겠습니다. Lodash를 사용한 특정...

[javscript]배열을 특정 키의 값에 따라 정렬하는 방법, _.orderBy

Lodash의 _.orderBy 메소드를 사용하면 배열을 특정 키의 값에 따라 정렬할 수 있습니다. 이 메소드는 배열의 각 항목을 정렬할 기준이 되는 하나 이상의 속성 이름과...

[css]autoprefixer: end value has mixed support, consider using flex-end instead warning 처리 및 다양한 에러 메시지 의미

이 경고 메시지는 CSS를 처리하는 도구인 Autoprefixer가 justify-content: end; 속성값을 처리하려 할 때 발생합니다. Autoprefixer는 CSS에 벤더 접두사를 자동으로 추가해 주는 도구로, 다양한 브라우저에서 CSS 속성이...