Twitch配信開始の通知を自動でツイートする ※旧
※2021/10/08 追記
Twitch API の Webhook サブスクリプション登録方法が更新され、WebSub 非推奨になり EventSub が推奨になったようです。
blog.twitch.tv
ということで色々試してみた結果、この記事よりかなり構成が変わりました。
なので、それについて新しく書き直しました。
wfoo13101.hatenablog.com
はじめに
この記事は、こちらの記事qiita.comを参考にしながら、分からなかったところのメモです。
こちらの記事冒頭にもあるように IFTTT を使えば手軽に配信開始の通知自体はできるんですが、遅延より何より、配信タイトルをツイートに入れたくて手作りに手を出しました。
目次
Twitch API への Webhook 登録
記事通り Twitch Developers に登録して、
クライアントIDとトークンを控えられたらOK。
はもっと後で実行するやつなので
の curl のところはとりあえず飛ばす。
配信通知を受け取る Webhook の登録
curl はまだ入れる情報が足りないのでここは飛ばす。
Webhook 用 API の開発
Twitter Developer への登録
ちょっと面倒。
自分の場合は、英語で申請した後に日本語のメールが来て、英語と同じような内容を日本語でちゃんと書いて返信したら登録できた。
単純な通知アプリを作りたい、というのの他に、個人で使う用です、とか、勉強がてらです、とか書いたけど必要だったかは分からない。
設定変更
プロジェクトを登録出来たら、
Settings で App permissions を Write 含むように変更する。
キー、トークン取得
記事内で取得したい情報は
consumer_key = Consumer Keys の API Key
consumer_secret = Consumer Keys の secret
access_token_key = Authentication Tokens の Access token
access_token_secret = Authentication の Tokens secret
という感じ。
consumer_key と consumer_secret はプロジェクトを登録した最初に表示されたと思う。そこで控えておかないと再表示できないので、再作成しないといけなくなる。
あとの二つは Keys and tokens で作成する。こちらも作成後に表示された時に控えておかないと、再作成しないといけなくなる。
Firebase functions の設定
何も知らなかったのでここで詰まった。
npm インストール
Firebase 登録
Functions を使うために料金プランをBlazeにする。
firebase login
Firebase にログイン。
firebase login
firebase init
Firebase最初の処理。
firebase init
するといろいろ質問される。
Are you ready to proceed?
（これからの処理をして大丈夫？）
→ y
Which Firebase CLI features do you want to set up for this folder?
（Firebase 機能の内、どれをセットアップする？）
→ Functions: Configure and deploy Cloud Functions のみ選択して決定
Please select an option
（オプションを選択、作成済みのプロジェクトを使うか、新たに作るかなど）
→ Use an existing project（先にプロジェクトを作成できている場合）
→ 作成済みのプロジェクト一覧が出てくるので選択して決定
What language would you like to use to write Cloud Functions?
（使用する言語は？）
→ 好きな方を選択（よく分からなければJavaScriptの方がいい？）
Do you want to use ESLint to catch probable bugs and enforce style?
（ESLint を使う？）
→ 使った方がいいと思うけど、後で設定とか調整が必要
Do you want to install dependencies with npm now?
（ついでに必要ないろいろを npm でインストールする？）
→ y
これでようやく、ある程度は下準備が出来た。
参考：
Firebaseの始め方 - Qiita
Firebase で Cloud Functions を簡単にはじめよう - Qiita
npm install twitter
先に作ったフォルダの中にいろいろファイルが出来ているはず。
コマンドプロンプトでその中の functions フォルダに移動（cd）。
Twitter でいろいろ出来るようになるやつを npm でインストール。
npm install twitter
index.js
細かい手順については省きますが，以下のようにコードを書き……
のコードを functions 内の index.js にコピー。
コード内の配信URLが固定で書かれているので編集。
'https://www.twitch.tv/' + streamInfo.user_login
にしても良さそう。
もしくは好きな文言に変える。
firebase deploy
そしたらデプロイをしてみる。
firebase deploy
ESLint 修正
そのままだと大体の場合 ESLint に怒られるはずなので調整。
Parsing error: Unexpected token =>
というエラーが発生していたら、.eslintrc.js に
parserOptions: {
ecmaVersion: 8,
},
を追加。
位置は多分どこでもいいけど、env の下がいい？
またデプロイをすると今度は大量に ESLint に怒られると思う。
1:27 error Strings must use doublequote
最初のは 1行目 27文字目という意味。
この位置を頼りに修正。
Strings must use doublequote
文字列でシングルクォート（'）を使ってるところをダブルクォート（"）にする。
Expected linebreaks to be 'LF' but found 'CRLF'
改行コードをLFにする。
Block must not be padded by blank lines
余計な空白行を削除する。
'data' is not defined
data の前に const を追加。
Expected space(s) after "if"
if の後に空白を入れる。
Missing space before opening brace
{ の前に空白を入れる。
Missing trailing comma
行の最後にカンマを入れる。
'+' should be placed at the end of the line
文字列を繋げる + は行の最後に入れる。
There should be no space after '{'
余計な空白を削除する。
Missing semicolon
行の最後にセミコロンを入れる。
Trailing spaces not allowed
行の最後にある余計な空白を削除する。
エラーがなくなるまで修正。
Webhook 登録
これまで飛ばしていた curl の出番。
配信通知を受け取る Webhook の登録
にある以下のコマンドを編集する。
curl -X POST -d "{\"hub.callback\":\"WebhookとするURL\", \"hub.mode\":\"subscribe\", \"hub.topic\":\"https://api.twitch.tv/helix/streams?user_id=130871908\", \"hub.lease_seconds\":\"864000\"}" -sS -H 'Content-Type: application/json' -H 'Authorization: Bearer さっきのアクセストークン' -H 'client-id: さっきのクライアントID' https://api.twitch.tv/helix/webhooks/hub
分かりやすくすると、こう。
curl -X POST -d "{ \"hub.callback\":\"WebhookとするURL\", \"hub.mode\":\"subscribe\", \"hub.topic\":\"https://api.twitch.tv/helix/streams?user_id=130871908\", \"hub.lease_seconds\":\"864000\" }" -sS -H 'Content-Type: application/json' -H 'Authorization: Bearer さっきのアクセストークン' -H 'client-id: さっきのクライアントID' https://api.twitch.tv/helix/webhooks/hub
編集部分
- WebhookとするURL
Firebase のページを確認
デプロイが成功していたら、Function のダッシュボードに関数が表示されているはず
（コピーしたままだったら、関数名が tw2tw）
これのトリガー列で、リクエストの下に小さく表示されているURL
- ～?user_id=130871908
Twitch のユーザーID（数字列）を取得する必要がある。
curl "https://api.twitch.tv/helix/users?login=ユーザー名" -H "Content-Type: application/json" -H "Authorization: Bearer トークン" -H "client-id: クライアントID"
ユーザー名部分には普通のアルファベットとかのユーザー名を入れる。
トークンとクライアントIDは Twitch で取得したものを入れる。
これを実行して取得できた id を user_id= の先に入れる。
- さっきのアクセストークン
Twitch で取得したトークン。
- さっきのクライアントID
Twitch で取得したクライアントID。
以上をすべて入れて、コマンドプロンプトで実行。
返事は特に帰ってこないが、それで多分大丈夫……。
2021/4/2追記
※このWebhook（サブスクリプション）は有効期限があり、10日で切れてしまう。
https://dev.twitch.tv/docs/api/webhooks-guide
上のcurlコマンドのbatファイルを作って、タスクスケジューラーに一週間毎実行で登録してみた。
2021/5/28追記
タスクスケジューラー自体は上手くいってるっぽい。
これで通知が上手くいってない場合、OAuthの期限切れの可能性。
適当なユーザID取得を流して401が返ってきた場合は多分、そう。
適当なユーザ情報取得コマンド
curl "https://api.twitch.tv/helix/users?login=ユーザー名" -H "Content-Type: application/json" -H "Authorization: Bearer アクセストークン" -H "client-id: クライアントID"
OAuthアクセストークン取得をやり直して、
batに書いたコマンドのアクセストークンを新しいものに変える。
確認
実際の動作は試しにTwitchで配信を開始して終了させ、
Twitterに投稿されているか見る必要がある。
あとは、Firebase のページでログを見ることが出来る。
Function execution started
から
Function execution took 243 ms, finished with status code: 200
となっていたら何事もなかった感じ。
Function execution took 411 ms, finished with status: 'crash'
とかになっていたら何かあったので直前のログを確認。
Unhandled rejection
とかあったら、大抵 Twitter 関連の問題。
[ { code: 187, message: 'Status is a duplicate.' } ]
とかあるので、code や message + Twitter errorで検索。
上の code: 187 は短い間隔で連続して同じツイートをしようとしたときに怒られるやつ。
code: 89 はトークンが期限切れしたとからしいので、
Authentication Tokens の Access token & secret を再作成する。
環境変数も入れ直してデプロイしなおす。
という感じでできました、というメモでした。
