YouTubeへのライブ配信機能をリリースするまで

by yurihondo

Slide 1

Slide 1 text

YouTubeへ　ライブ配信機能を　　リリースするまで yurihondo @U-NEXT

Slide 2

Slide 2 text

yurihondo Software Engineer@U-NEXT X: yurihondo @yuyuyuyuyuri 家を買う契約をした

Slide 3

Slide 3 text

YouTubeへライブ配信機能を作るにあたって必要な対応を調査・整理するが大変でした特にリリースにあたって対応に苦労したでナレッジを共有します Motivation

Slide 4

Slide 4 text

● YouTubeへライブ配信機能をAndroidアプリで実現する方法 ● 上記機能をもつアプリをリリースするにあたって、対処が必要な事柄へ対応方法 Topics to be Covered

Slide 5

Slide 5 text

● YouTube以外へライブ配信実現方法 ● YouTube系APIや利用しているLib 詳細 ● アプリ自体品質担保やテスト手法 ● Androidアプリ以外実装に関する詳細 Topics NOT to be Covered

Slide 6

Slide 6 text

こセッションで話す事柄、2023/8/31時点情報に基づいて構成されています Note

Slide 7

Slide 7 text

1. YouTube Streaming APIを使って配信機能を実現する 2. APIを使うためにGoogle OAuth2.0を利用する 3. こ機能をプロダクション環境で利用するにあたって Google 審査を受ける必要がある TL;DR

Slide 8

Slide 8 text

Agenda 0. Roadmap for release 1. Prepare to use YouTube API 2. Realize streaming feature 3. Pass Google verification

Slide 9

Slide 9 text

Roadmap For Release 0

Slide 10

Slide 10 text

Goal Hello, World! アプリから YouTubeへライブ配信機能をリリースすること

Slide 11

Slide 11 text

Google Auth Server Hello, World! Roadmap for release

Slide 12

Slide 12 text

Google Auth Server Send Request Obtain Token ①YouTube APIを使うため Tokenを取得 Roadmap for release

Slide 13

Slide 13 text

Google Auth Server Create live with Token ＆ Send streaming data Hello, World! ②APIを使ってライブ配信を実現 Roadmap for release

Slide 14

Slide 14 text

Google Auth Server Hello, World! ③リリースする時にGoogle 審査に合格 Roadmap for release

Slide 15

Slide 15 text

Roadmap for release 1 2 3 Prepare to use YouTube API Realize streaming feature Pass Google Verification

Slide 16

Slide 16 text

Simple Streaming App

Slide 17

Slide 17 text

Simple Streaming App App Web (YouTube) > https://www.youtube.com/

Slide 18

Slide 18 text

Prepare to use YouTube API 1

Slide 19

Slide 19 text

まず最初に

Slide 20

Slide 20 text

- YouTube Data API - YouTube Streaming API - IFrame Player API - YouTube Analytics API - YouTube Reporting API YouTube APIs > https://developers.google.com/youtube

Slide 21

Slide 21 text

- YouTube Data API - YouTube Streaming API - IFrame Player API - YouTube Analytics API - YouTube Reporting API YouTube APIs > https://developers.google.com/youtube/v3 メインとなるAPI、コンテンツ検索など YouTube 基本的な機能をほぼ全部を提供

Slide 22

Slide 22 text

- YouTube Data API - YouTube Streaming API - IFrame Player API - YouTube Analytics API - YouTube Reporting API YouTube APIs > https://developers.google.com/youtube/v3/live/getting-started YouTubeライブ配信に関わる機能提供内部的にData APIを利用今回利用するAPI

Slide 23

Slide 23 text

- YouTube Data API - YouTube Streaming API - IFrame Player API - YouTube Analytics API - YouTube Reporting API YouTube APIs > https://developers.google.com/youtube 埋め込み YouTubeプレイヤーを提供

Slide 24

Slide 24 text

- YouTube Data API - YouTube Streaming API - IFrame Player API - YouTube Analytics API - YouTube Reporting API YouTube APIs > https://developers.google.com/youtube/reporting チャンネルなど分析関連 API (使ったことない)

Slide 25

Slide 25 text

- YouTube Data API - YouTube Streaming API - IFrame Player API - YouTube Analytics API - YouTube Reporting API YouTube APIs > https://developers.google.com/youtube GCP上で有効化すると利用できるようになる

Slide 26

Slide 26 text

- YouTube Data API - YouTube Streaming API - IFrame Player API - YouTube Analytics API - YouTube Reporting API YouTube APIs > https://developers.google.com/youtube 無料で利用可能

Slide 27

Slide 27 text

- YouTube Data API - YouTube Streaming API - IFrame Player API - YouTube Analytics API - YouTube Reporting API YouTube APIs > https://developers.google.com/youtube ただし😲

Slide 28

Slide 28 text

- YouTube Data API - YouTube Streaming API - IFrame Player API - YouTube Analytics API - YouTube Reporting API YouTube APIs > https://developers.google.com/youtube/v3/determine_quota_cost API 呼び出しごとにQuotaを消費する

Slide 29

Slide 29 text

Quota > https://developers.google.com/youtube/v3/determine_quota_cost ● YouTube Data APIを呼ぶ毎に消費される ● 初期 10,000[unit/day]付与されている ● 引き上げ申請可能

Slide 30

Slide 30 text

Quota > https://developers.google.com/youtube/v3/getting-started#calculating-quota-usage method action quota list Retrieves (GET) a list of zero or more resources. 1 insert Creates (POST) a new resource. 50 update Modifies (PUT) an existing resource to reflect data in your request. 50 delete Removes (DELETE) a specific resource. 50 基本、読み取り系 1、書き込み系 50。イレギュラーで、 searchリソース list 100、videoリソース insert 1600などなど Resource +

Slide 31

Slide 31 text

Quota > https://developers.google.com/youtube/v3/determine_quota_cost

Slide 32

Slide 32 text

Quota > https://developers.google.com/youtube/v3/determine_quota_cost リファレンスも全メソッドについて網羅されていない正確な消費量 GCP コンソールから確認するがベター TIPS

Slide 33

Slide 33 text

1. Setup GCP GCP上でYouTube APIを利用可能にする 2. Get Token AppでOAuthを行い、APIを利用するため Tokenを取得/保存 1 Prepare to use YouTube API Roadmap

Slide 34

Slide 34 text

1. Setup GCP GCP上でYouTube APIを利用可能にする 2. Get Token AppでOAuthを行い、APIを利用するため Tokenを取得/保存 1 Prepare to use YouTube API Roadmap

Slide 35

Slide 35 text

Enable API on GCP GCP アカウントとプロジェクト作成方法割愛😎

Slide 36

Slide 36 text

Enable API on GCP YouTube APIを有効化

Slide 37

Slide 37 text

Enable API on GCP OAuth clientを作成

Slide 38

Slide 38 text

Enable API on GCP

Slide 39

Slide 39 text

Enable API on GCP APIを利用するにあたって必要になるスコープを設定する

Slide 40

Slide 40 text

Enable API on GCP ./auth/youtubeを手動追加

Slide 41

Slide 41 text

Enable API on GCP こんな感じに表示されれ 👌

Slide 42

Slide 42 text

Enable API on GCP

Slide 43

Slide 43 text

Enable API on GCP こんな感じに表示されれ 👌

Slide 44

Slide 44 text

Enable API on GCP API Keyで今回ユースケース対応できない TIPS

Slide 45

Slide 45 text

Enable API on GCP GCP 設定これでOK👌

Slide 46

Slide 46 text

1. Setup GCP GCP上でYouTube APIを利用可能にする 2. Get Token AppでOAuthを行い、APIを利用するため Tokenを取得/保存 1 Prepare to use YouTube API Roadmap

Slide 47

Slide 47 text

Simple Streaming App Google Auth Server Send Request Obtain Token

Slide 48

Slide 48 text

OAuth 2.0 for Google APIs > https://developers.google.com/identity/protocols/oauth2/native-app

Slide 49

Slide 49 text

Get Access Token AppAuth for Androidを使う > https://developers.google.com/identity/protocols/oauth2/native-app

Slide 50

Slide 50 text

Reasons for adopting AppAuth 1. ブラウザベース認証フローを提供している 2. Google以外認証が増えた場合なども柔軟に対応可能 3. Google Play開発者サービスに依存しない TIPS

Slide 51

Slide 51 text

Reasons for adopting AppAuth 1. ブラウザベース認証フローを提供している 2. Google以外認証が増えた場合なども柔軟に対応可能 3. Google Play開発者サービスに依存しないブラウザ(Custom Tabs)で OAuthフローを提供するで、セキュリティ面やユーザー体験面で良い TIPS

Slide 52

Slide 52 text

Get Access Token 認証時にブランドアカウントを選択可能 TIPS

Slide 53

Slide 53 text

1. ブラウザベース認証フローを提供している 2. Google以外認証が増えた場合なども柔軟に対応可能 3. Google Play開発者サービスに依存しない Get Access Token YouTube以外配信先ができて、新しい認証を行う場合でも流用できる TIPS

Slide 54

Slide 54 text

1. ブラウザベース認証フローを提供している 2. Google以外認証が増えた場合なども柔軟に対応可能 3. Google Play開発者サービスに依存しない Get Access Token 地域やデバイス事情に対応 TIPS

Slide 55

Slide 55 text

Google Auth Server Get Access Token Browser Repository Activity Encrypted DataStore AppAuth App

Slide 56

Slide 56 text

Google Auth Server Get Access Token Browser Repository Activity Encrypted DataStore AppAuth Auth request App

Slide 57

Slide 57 text

Google Auth Server Get Access Token Browser Repository Activity Encrypted DataStore AppAuth Authorize Login App

Slide 58

Slide 58 text

Google Auth Server Get Access Token Browser Repository Activity Encrypted DataStore AppAuth Redirect with Auth Code App

Slide 59

Slide 59 text

Google Auth Server Get Access Token Repository Activity Encrypted DataStore AppAuth Pass Auth Code Save encrypted Auth Code App

Slide 60

Slide 60 text

Google Auth Server Get Access Token Repository Activity Encrypted DataStore AppAuth Exchange code Token App Save encrypted Token

Slide 61

Slide 61 text

詳しい実装こちら https://github.com/yurihondo/simplestreaming/blob/main /core/data/src/main/java/com/yurihondo/simplestreaming /data/repository/AccountRepositoryImpl.kt

Slide 62

Slide 62 text

Google Auth Server Get Access Token Browser Repository Activity Encrypted DataStore AppAuth Authorize Login

Slide 63

Slide 63 text

Get Access Token

Slide 64

Slide 64 text

Get Access Token 認証情報を消せ再度ログインフローを試せる TIPS

Slide 65

Slide 65 text

Google Auth Server Get Access Token Browser Repository Activity Encrypted DataStore AppAuth Save encrypted Auth State

Slide 66

Slide 66 text

Get Access Token CryptoHelper 暗号化 Tinkを利用 TIPS

Slide 67

Slide 67 text

Get Access Token EncryptedAuthStateSerializer TIPS

Slide 68

Slide 68 text

Get Access Token DataStoreModule TIPS

Slide 69

Slide 69 text

Google Auth Server Get Access Token Repository Activity Encrypted DataStore AppAuth Exchange code Token App Save encrypted Token

Slide 70

Slide 70 text

Enable API on GCP AccountRepository　

Slide 71

Slide 71 text

Enable API on GCP AccountRepository Refresh 処理を忘れないこと TIPS

Slide 72

Slide 72 text

Enable API on GCP AccountRepository　 TIPS

Slide 73

Slide 73 text

Google Auth Server Hello, World! Get Access Token APIを使うため準備完了

Slide 74

Slide 74 text

Feature Complete

Slide 75

Slide 75 text

Realize Streaming feature 2

Slide 76

Slide 76 text

Simple Streaming App Google Auth Server Create live with Token ＆ Send streaming data Hello, World!

Slide 77

Slide 77 text

2 Realize streaming feature 1. Create Live YouTube Live Streaming APIを使って、Live streamを作成 2. Stream using RTMPS 配信データをRTMPSで送信し、ライブ配信機能を実現 Roadmap

Slide 78

Slide 78 text

Slide 79

Slide 79 text

Live streaming Create Live

Slide 80

Slide 80 text

Live streaming LiveStream Broadcast

Slide 81

Slide 81 text

Live streaming LiveStream Broadcast Bind

Slide 82

Slide 82 text

Create Live build.gradle.kts

Slide 83

Slide 83 text

Create Live LiveStreamingRepository　

Slide 84

Slide 84 text

Create Live LiveStreamingRepository　先に取得したTokenを渡して YouTubeApiを初期化

Slide 85

Slide 85 text

Create Live LiveStreamingRepository　 AndroidJsonFactoryとかでもOK

Slide 86

Slide 86 text

Live streaming LiveStream Broadcast

Slide 87

Slide 87 text

Create Live LiveStreamingRepository　 > https://developers.google.com/youtube/v3/live/docs/liveBroadcasts/insert

Slide 88

Slide 88 text

Create Live LiveStreamingRepository　 > https://developers.google.com/youtube/v3/live/docs/liveBroadcasts/insert Broadcast 作成リクエスト

Slide 89

Slide 89 text

Create Live LiveStreamingRepository　 > https://developers.google.com/youtube/v3/live/docs/liveBroadcasts/insert 設定対象パーツを宣言（レスポンスにも含まれる）

Slide 90

Slide 90 text

Create Live LiveStreamingRepository　 > https://developers.google.com/youtube/v3/live/docs/liveBroadcasts/insert

Slide 91

Slide 91 text

Create Live LiveStreamingRepository　 > https://developers.google.com/youtube/v3/live/docs/liveBroadcasts/insert

Slide 92

Slide 92 text

Create Live LiveStreamingRepository　 > https://developers.google.com/youtube/v3/live/docs/liveBroadcasts/insert あと実行するだけ

Slide 93

Slide 93 text

Live streaming LiveStream Broadcast

Slide 94

Slide 94 text

Create Live LiveStreamingRepository　 > https://developers.google.com/youtube/v3/live/docs/liveStreams/insert

Slide 95

Slide 95 text

Create Live LiveStreamingRepository　 > https://developers.google.com/youtube/v3/live/docs/liveStreams/insert

Slide 96

Slide 96 text

Create Live LiveStreamingRepository　 > https://developers.google.com/youtube/v3/live/docs/liveStreams/insert RTMPS 指定 ”rtmp”でOK

Slide 97

Slide 97 text

Live streaming LiveStream Broadcast Bind

Slide 98

Slide 98 text

Create Live LiveStreamingRepository　

Slide 99

Slide 99 text

Create Live LiveStreamingRepository　 Broadcast, LiveStream IDを指定してBind実行

Slide 100

Slide 100 text

Live created Create Live

Slide 101

Slide 101 text

Slide 102

Slide 102 text

Live streaming Stream using RTMPS Hello, World!

Slide 103

Slide 103 text

SimpleStreaming 実装こちら https://github.com/yurihondo/simplestreaming/blob/m ain/core/data/src/main/java/com/yurihondo/simplestre aming/data/repository/LiveStreamingRepositoryImpl.kt

Slide 104

Slide 104 text

Create Stream URL LiveStreamingRepository　配信先URLを作成

Slide 105

Slide 105 text

Create Stream URL LiveStreamingRepository　 ingestionAddressもあるがこれ RTMP向けなで注意 TIPS

Slide 106

Slide 106 text

Streaming state ready testing live complete Transition APIでlive状態にする

Slide 107

Slide 107 text

Streaming state ready testing live complete

Slide 108

Slide 108 text

Streaming state ready testing live complete

Slide 109

Slide 109 text

Streaming state ready testing live complete testing スキップできない TIPS

Slide 110

Slide 110 text

Create Live LiveStreamingRepository　

Slide 111

Slide 111 text

Create Live LiveStreamingRepository　現在 Stateを取得 LiveStreamingRepository　

Slide 112

Slide 112 text

Create Live LiveStreamingRepository　現在 Stateに合わせ次 Stateへ変更

Slide 113

Slide 113 text

Create Live LiveStreamingRepository　 State 切り替えに結構時間がかかる 5[sec] * 12回 1[min]ほど断続的に実行 TIPS

Slide 114

Slide 114 text

Create Live LiveStreamingRepository　 TIPS データ送信し始めると自動でlive状態にする設定ある笑

Slide 115

Slide 115 text

Live streaming Hello, World!

Slide 116

Slide 116 text

Google Verification じゃぁ配信してみよう

Slide 117

Slide 117 text

Google Verification

Slide 118

Slide 118 text

Feature Complete ライブ配信が有効になっているか確認 > https://www.youtube.com/ TIPS

Slide 119

Slide 119 text

Feature Complete > https://www.youtube.com/ TIPS

Slide 120

Slide 120 text

Feature Complete > https://support.google.com/youtube/answer/9228390?hl=ja&co=GENIE.Platform%3DAndroid# TIPS チャンネル登録者数制限ない (0人でもライブ配信可能)

Slide 121

Slide 121 text

Feature Complete

Slide 122

Slide 122 text

Pass Google Verification 3

Slide 123

Slide 123 text

3 Pass Google Verification ● Google Verification Google OAuth2.0を利用した Token 取得を一般公開するアプリでも使えるように、 Googleが定める審査に合格する Roadmap

Slide 124

Slide 124 text

Google Verification 機能実現できているなぜ審査が必要なか🤔

Slide 125

Slide 125 text

Google Verification Authにテスト環境と本番環境設定がある

Slide 126

Slide 126 text

Google Verification テスト環境制限 1. 100アカウントまでしかOAuthを実行できない 2. OAuthプロセスにおけるログイン時に ”こアプリ未検証である”旨が表示される

Slide 127

Slide 127 text

Slide 128

Slide 128 text

Google Verification

Slide 129

Slide 129 text

Slide 130

Slide 130 text

Google Verification

Slide 131

Slide 131 text

Google Verification GCPコンソールで OAuth 設定を本番環境に切り替える

Slide 132

Slide 132 text

Scope categories > https://developers.google.com/identity/protocols/oauth2/production-readiness/policy-compliance#sensitive-restricted-scope-verification non-sensitive以外スコープを利用する場合、本番切り替え時に審査が必要 non-sensitive sensitive restricted Needs verification Needs verification

Slide 133

Slide 133 text

Slide 134

Slide 134 text

Google Verification > https://developers.google.com/identity/protocols/oauth2/production-readiness/policy-compliance#sensitive-restricted-scope-verification 担当チームからメールが届き、必要に応じてGoogle 規約に準拠するため対応を行う The Google Trust & Safety Security & Privacy Team

Slide 135

Slide 135 text

Google Verification > https://developers.google.com/identity/protocols/oauth2/production-readiness/policy-compliance#sensitive-restricted-scope-verification 担当チームからメールが届き、必要に応じてGoogle 規約に準拠するために対応を行う The Google Trust & Safety Security & Privacy Team 審査が完了するまでテスト環境制限が継続する

Slide 136

Slide 136 text

Google Verification > https://support.google.com/cloud/answer/9110914#how-long&zippy=%2Chow-long-will-the-verification-process-take 担当チームからメールが届き、必要に応じてGoogle 規約に準拠するために対応を行う The Google Trust & Safety Security & Privacy Team 最近だとやりとりや対応も含めて審査完了までに 4~6週間以上かかる...いや... TIPS

Slide 137

Slide 137 text

Google Verification > https://support.google.com/cloud/answer/9110914#how-long&zippy=%2Chow-long-will-the-verification-process-take 担当チームからメールが届き、必要に応じてGoogle 規約に準拠するために対応を行う The Google Trust & Safety Security & Privacy Team 指摘をなるべく減らすために事前準備が重要 TIPS

Slide 138

Slide 138 text

Google Verification 審査通過ために... 何をすれ良いか🤔？

Slide 139

Slide 139 text

Google Verification ガイドラインに従って各対応を行い、 GCP OAuthクライアント設定に反映させる > https://developers.google.com/identity/protocols/oauth2/production-readiness/sensitive-scope-verification

Slide 140

Slide 140 text

Google Verification Privacy policy 設定 03 Webサイト設定＆Domain証明 02 ブランドガイドライン対応 01 デモ動画作成＆アップロード 04

Slide 141

Slide 141 text

Google Verification Privacy policy 設定 03 Webサイト設定＆Domain証明 02 ブランドガイドライン対応 01 デモ動画作成＆アップロード 04

Slide 142

Slide 142 text

Google Verification > https://developers.google.com/identity/branding-guidelines > https://developers.google.com/youtube/terms/branding-guidelines

Slide 143

Slide 143 text

Google Verification

Slide 144

Slide 144 text

Google Verification ログインボタンに YouTubeロゴを適切に配置

Slide 145

Slide 145 text

Google Verification Privacy policy 設定 03 Webサイト設定＆Domain証明 02 ブランドガイドライン対応 01 デモ動画作成＆アップロード 04

Slide 146

Slide 146 text

Google Verification アプリホームページが必要 > https://developers.google.com/identity/protocols/oauth2/production-readiness/sensitive-scope-verification

Slide 147

Slide 147 text

Google Verification ドメイン所有権証明が必要

Slide 148

Slide 148 text

Google Verification > https://yurihondo.com

Slide 149

Slide 149 text

Google Verification

Slide 150

Slide 150 text

Google Verification 認証画面設定へ反映

Slide 151

Slide 151 text

Google Verification Privacy policy 設定 03 Webサイト設定＆Domain証明 02 ブランドガイドライン対応 01 デモ動画作成＆アップロード 04

Slide 152

Slide 152 text

Google Verification アプリがユーザーデータをどように扱うかについて明示する > https://developers.google.com/identity/protocols/oauth2/production-readiness/sensitive-scope-verification

Slide 153

Slide 153 text

Google Verification

Slide 154

Slide 154 text

Google Verification ● Google API serviceが定めるユーザーデータポリシーに準拠するように必要に応じてアプリデータ扱いを修正 ● プライバシーポリシーへリンクホームページと同じドメインに配置いること ● ホームページトップにプライバシーポリシーへリンクがあること > https://developers.google.com/terms/api-services-user-data-policy

Slide 155

Slide 155 text

Google Verification > https://developers.google.com/terms/api-services-user-data-policy

Slide 156

Slide 156 text

Google Verification > https://yurihondo.com#privacy-policy

Slide 157

Slide 157 text

Google Verification

Slide 158

Slide 158 text

Google Verification 利用規約記載任意だけど、追加しておくことをおすすめする

Slide 159

Slide 159 text

Google Verification Privacy policy 設定 03 Webサイト設定＆Domain証明 02 ブランドガイドライン対応 01 デモ動画作成＆アップロード 04

Slide 160

Slide 160 text

Google Verification アプリがAPIをどように使用しているかを明示するビデオを作成して、YouTubeあげURLを共有する > https://developers.google.com/identity/protocols/oauth2/production-readiness/sensitive-scope-verification

Slide 161

Slide 161 text

Google Verification ● APIを呼ぶをタイミング全てキャプションを入れる ● OAuth時ログイン画面などで言語をEnglishに選択し直す ● プラポリ URLなど全て遷移する TIPS

Slide 162

Slide 162 text

Google Verification

Slide 163

Slide 163 text

Google Verification 🙏健闘を祈る🙏

Slide 164

Slide 164 text

以上

Slide 165

Slide 165 text

● YouTubeへライブ配信機能実装自体そ仕様を知っていれそこまで複雑でありません、ぜひ参考にしてください ● Google Verification とても時間がかかるでリリースタイミングなど ...かなりバッファをみた方が良い ● 話せなかったことが多いでまた別機会で続きを... Conclusion

Slide 166

Slide 166 text

Thanks