動画の解説
vol1の続きです
実際にAPIを使ってコメントの取得までやっています
画像クリックで飛べます！
APIをいじくり倒す
前回vol.1はgoogle cloud plattformでAPIのkeyを取得したりしました
つまらない環境設定みたいな感じで大変申し訳ない
で
す
が
ここからはついにYoutube Data APIをいじくり倒して
ライブチャット取得まで駆け抜けるぜ!
今回使うAPIはこいつだあ～！！
1つ目は、
でれでれでん
Youtube Data API
いえーいっていう効果音入ってます
こいつは、YoutubeのAPIの兄貴分てきな役割で、
- 動画の検索
- サムネイルの編集
- 動画のアップロード
などなど
Youtubeに関する 基本的な操作 ができます
その中でも、今回は、前回作ったパラメーターをもとに動画のリストを取得する
https://www.googleapis.com/youtube/v3/videos
を使いやす
API keyで僕こういうものなんですけどって自己紹介したのち
Video Idでこの動画の情報欲しいんですけどっていうと
兄貴が任せい！！
という感じで持ってきてくれます
あにきいい！いつもお世話になります。
取ってきた 情報(items) の中に、
chat id
たるもんがありますのでこいつが大事になるので
こいつを自分の懐にしまいます。
そして2つ目
Youtube LiveStreaming API
ドドン！っていう効果音入ってます。
こいつは、Youtubeの中でも Live を専門に仕切ってる特殊部隊
YoutubeLiveのことは俺に任せろと言わんばかりの機能を持っています
さっき兄貴からもらった
chat id
をAPI keyや
他のパラメーターを一緒に渡すと
- Liveの始まった時間
- LiveChatを送った人のアカウント名
- SuperChat
などなど、 Liveに関する情報(items) ならなんでも持ってきます
さすが特殊部隊
今回は、その中でもLiveChatに関する情報取得する
https://www.googleapis.com/youtube/v3/liveChat/messages
を使い、LiveChatの内容とアカウント名をとってきます
非同期処理とは
具体的にどうTouchDesignerで実装すんねん！
っていうところですが、
TextDATに
import requests
url ='https://www.googleapis.com/youtube/v3/videos'
data = requests.get(url)
# この後にdataというlistに入ってるchat idを取り出す処理を書く
みたいな処理を書いて、
任意のタイミングでこのScriptをRunさせるみたいなことができる
んですが！！！
これだと取得している間、
TouchDesignerが止まってしまいます！！
(ちなみに、上のコードを鬼適当なので動きもしないし正しくもありません)
これは不便すぎる！
それを解決してくれるのが
なにそれ、どこにあるんだよ、使ったことないわ
そんな声が聞こえてきそうですが。。。
DATの中でも圧倒的優秀さを誇り
今回のようなAPIを使ってwebの情報を取ってきたり、逆に渡したりなどする処理をすることができます
こいつを使えばTouchDesiignerが止まることがありません！！
え、なんでかって？？
それはWeb Client DATが非同期処理だからです。
来ました！非同期処理！！
非同期処理というのは、
あるタスクを実行している最中に、その処理を止めることなく別のタスクを実行できる方式を指します。
API自体が動画を取得している処理の間も、TouchDesigner側の処理を止めなくて済みます！
逆に言うと先ほどのtextDATでRunしていた方は、
APIの処理が完了するまで、TouchDesignerの処理が止まっていた
ということですね。はい。。。
WebClientDATあるある言いたい
ここまでいろいろ説明してきて
ようやくTouchDesignerの画面戻るが、
前回でAPIkeyやidなどをmergeしたDATをWeb Client DATのInputに詰め込むんだけど、
ここで、mergeからノードひぱってきてWeb Client DAT置いて
よしurlにAPIも入れたぞ
ほれ！GET!
ってやると、
あれ?なんかAPIkeyがダメって言われて取ってこれない、、、
おい！なんでだよー
ってよくなります。
これ Inputが上に入ってるからなんですね。
下に入れないとダメみたい。
お気をつけあそばせ
GETした後の処理
chad idを取得するWeb Client DATには
次ようにchat id をほかのtextDATに入れる処理を
WebClientDATの 右下の↓ からTextDAT(callback)開いて書きます
# me - this DAT.
# webClientDAT - The connected Web Client DAT
# statusCode - The status code of the response, formatted as a dictionary with two key-value pairs: 'code', 'message'.
# headerDict - The header of the response from the server formatted as a dictionary. Only sent once when streaming.
# data - The data of the response
import json
table = op('chatid')
commentOp = op('comment')
table = op('chatid')
def onConnect(webClientDAT):
return
def onDisconnect(webClientDAT):
return
def onResponse(webClientDAT, statusCode, headerDict, data):
table.clear()
commentOp.clear()
tdata = json.loads(data)
liveStreamingDetails = tdata['items'][0]['liveStreamingDetails']
if 'activeLiveChatId' in liveStreamingDetails.keys():
chat_id = liveStreamingDetails['activeLiveChatId']
table.appendRow(['liveChatId',chat_id])
return
謎にオペレーター追加されてるけどそれは、 動画見てね
一旦、jsonに変換してそこから検索してtableDATに入れてます
LiveChatのメッセージを取得する処理も2つ目のWebClientDATのcallbackに書いていきます
# me - this DAT.
# webClientDAT - The connected Web Client DAT
# statusCode - The status code of the response, formatted as a dictionary with two key-value pairs: 'code', 'message'.
# headerDict - The header of the response from the server formatted as a dictionary. Only sent once when streaming.
# data - The data of the response
import json
commentOp = op('comment')
def onConnect(webClientDAT):
return
def onDisconnect(webClientDAT):
return
def onResponse(webClientDAT, statusCode, headerDict, data):
tdata = json.loads(data)
for item in tdata['items']:
usr = item['authorDetails']['displayName']
msg = item['snippet']['displayMessage']
commentOp.appendRow([usr, msg])
return
こちらも同じようにjsonに変換して、他のTableDAT(commentって名前の)
WebClientDATにてGETしたあとの処理がこれなわけですね
コメントゲットだぜ
そんなわけでYoutubeAPIを使ってLiveのコメントを取ってくることができました!
ここからビジュアルに起こしていきます
次回vol3で
アデュー
そして、
TouchDesignerでのオンラインイベントの可能性を広げられることができんじゃね？
って思っている方いましたら是非参考にしていただければ