[Android] - Youtube API 적용해보기

짧은 프로젝트를 하면서 TMDB API를 이용해 영화 관련 앱을 만들고 있었습니다.

차별화된 기능으로 영화 이름에 대한 트레일러 영상을 제공하고 싶었습니다.

 

TMDB API는 공공 API로 영화에 대한 세부 정보를 알 수 있습니다.

https://developer.themoviedb.org/reference/intro/getting-started

Getting Started

 

안타깝게도, 영화에 대한 세부 정보는 제공하지만, 영화 트레일러와 같은 영상 링크는 제공해주지 않더라고요,
간단한 트레일러까지 제공해 주면 좋지 않을까 생각했습니다.

 

트레일러를 제공해주기 위한 매개체로는 가장 대중적인 Youtube로 정했고, Youtube API가 있지 않을까 해서 자료를 서칭 해봤습니다.

 

우선 처음으로 찾아본 API는 YouTube Android Player API였습니다.

https://developers.google.com/youtube/android/player?hl=ko

YouTube Android Player API  |  Google for Developers

하지만 이제 지원이 중지되었다고 하더라고요...

 

그래서 다른 것을 찾아보기로 했습니다.

 

다음으로 찾은 것은  Youtube Data API였습니다.

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

YouTube Data API 개요  |  Google for Developers

 

해당 API를 사용하기 위해서는 google cloud에 앱을 등록해야 합니다.

https://console.cloud.google.com/

Google 클라우드 플랫폼

 

등록하는 방법은 간단합니다.

 

 

새 프로젝트를 눌러줍니다.

앱 이름을 입력하고 만들어주세요.

 

 

API 및  서비스를 눌러주세요.

 

 

누르면 페이지가 나오는데 API 및 서비스 사용 설정을 눌러주세요

 

Youtube API를 검색해 줍니다.

 

 

아마 처음 들어가시면 관리가 아닌 사용이라고 적혀있을 거예요.

 

사용을 누른 후 사용자 인증 정보로 들어가 주세요.

 

 

API 키를 만들어주세요.

 

 

API키를 기억해 주세요. 나중에 요청 보낼 때 써야 합니다.

 

API를 사용하기 전에,

Youtube Player View가 필요합니다.

https://github.com/PierfrancescoSoffritti/android-youtube-player

GitHub - PierfrancescoSoffritti/android-youtube-player: YouTube Player library for Android and Chromecast, stable and customizab

저는 해당 라이브러리를 통해서 Youtube Player View를 구현했고, 동영상 재생을 관리해 봤습니다.

 

 

동영상을 재생할 뷰를 만들어주세요.

해당 뷰는 유튜브 UI처럼 생긴 뷰를 의미합니다.

 

YouTubePlayerView youTubePlayerView = findViewById(R.id.youtube_player_view);
getLifecycle().addObserver(youTubePlayerView);

youTubePlayerView.addYouTubePlayerListener(new AbstractYouTubePlayerListener() {
  @Override
  public void onReady(@NonNull YouTubePlayer youTubePlayer) {
    String videoId = "S0Q4gqBUs7c";
    youTubePlayer.loadVideo(videoId, 0);
  }
});

 

제공된 문서를 보면, videoId만 넣어주면, 자동으로 유튜브가 연결되는 라이브러리입니다.

저는 영화 이름에 대한 트레일러 영상이 필요했기에, Youtube Data API에서 search를 이용했습니다.

https://developers.google.com/youtube/v3/docs/search/list?hl=ko

Search: list  |  YouTube Data API  |  Google for Developers

 

 

PostMan처럼 임시로 사용해 볼 수 있는 기회가 있어서, 데이터를 요청하고, 받는 코드를 작성하기 조금 수월했던 것 같습니다.

그럼에도 엄청난 response 데이터 형식에 조금 놀랐지만요,,

 

다음과 같이 query 매개변수에 대한 정의도 해주고,, 친절했던 것 같습니다.

 

API 매개변수에 따르면 part는 snippet으로 설정하고, 영화 이름  즉 검색어를 q라는 매개변수에 담아서 보내줍니다.

이를 바탕으로, Retrofit 호출문은 다음과 같이 구성됩니다.

@GET("search")
suspend fun getMovieTrailer(
    @Query("key") apiKey: String = BuildConfig.YOUTUBE_API_KEY,
    @Query("part") part: String = "snippet",
    @Query("q") movieName: String,
): Response<YoutubeSearchResponse>

 

반환값은 정말~정말 복잡하므로, data from json을 통해서 자동으로 만들어주세요...

저는 하나하나 입력하다가 계속 형식이 틀렸던 기억이 있네요

 

Repository code입니다.

저는 영상 하나를 원했기 때문에 가장 위에 있는 영상의 videoId만 가져왔습니다.

여기서 주의할 점은 vidoeId가 int가 아닌 string 값이라는 점입니다.. 

처음에 int로 하고, 코드를 돌렸는데 계속 터져서 한참 찾았었습니다 ㅠ

 

이제 트레일러 영상 id에 대한 요청을 viewModel에서 ui로 전달해야 합니다.

viewModel은 movieTitle에 대한 요청 쿼리를 날리고, vidoeId를 반환받습니다.

만약 ""이 아닐 경우는 영상이 존재한 경우이기 때문에 uiState의 videoId값을 업데이트해 줍니다.

영상이 존재하지 않는다면, 영상 검색 실패에 대한 UI 처리를 위해 event 값을 emit 합니다.

 

이에 따른 UI에서는 다음과 같은 작업을 합니다.

• videoId가 있을 경우, 해당 아이디로 youtube player를 재생한다.
• 없을 경우 snackbar를 띄운다.

 

videoId가 업데이트되었다면, Youtube Player에 비디오 id에 대한 영상을 load 합니다.

더 자세한 사용법이 알고 싶다면, 위 첨부된 링크에서 본인의 앱 시나리오에 맞게 사용하면 될 것 같습니다.

저처럼 단일 영상을 다루고 싶다면, 해당 코드로도 충분합니다.

 

결과는 다음과 같습니다.

 

전문적인 트레일러 영상이 나오는 영화도 있고, 안 나오는 영화도 있더라고요.

아마 검색어에 대한 영상중 첫 영상을 들고 오기 때문에 그런 것 같습니다.

Youtube Data API 사용법에 대해 다룬 글이 많이 없어서 적용하는데 꽤 애를 먹었던 것 같습니다 ㅎㅎ.