Bye Bye Moore

猫マンション建築の野望を胸に零細事業主として資本主義の荒波に漕ぎ出したアラサー男の技術メモ

埋め込みYoutubeの動画にオレオレ字幕や解説をつける裏技 その1:Youtube APIについて

Youtube、便利ですよね。
サイトに埋め込みできますし、自動再生やら特定のところから再生やらといった設定ができます。
字幕のオンオフも、パラメータで制御できます。
動画と再生リストを埋め込む - YouTube ヘルプ

ところが、です。
当然といえば当然なのですが、存在してない字幕は埋め込みではどうすることもできません。

一応、作者さんに自己推薦で字幕をお願いする方法が公式から提供されてるのですが……
必ずしも反応してもらえるわけじゃありません。
https://productforums.google.com/forum/#!topic/youtube-ja/NOPVehWE3pE

どーしても翻訳文載せないとダメな場合、それだと困りますよね。
そんな私と貴方に、Youtube Developer API
Implementing OAuth 2.0 Authentication  |  YouTube Live Streaming API  |  Google Developers
各種便利機能を提供してくれています。
今回はその中の「再生ステータス」を使います。
実装手順は以下のようになります。

  1. HTMLページにYotubeの埋め込み動画を入れる
  2. 配列に再生経過時間と翻訳スクリプトをブッ込む。
  3. 埋め込み動画下の領域(divを想定)に翻訳スクリプトレンダリング
  4. <必要なら>上記ページを任意のサーバにアップロードし iframeで呼び出し

参考もとのサイトさんではPHPっぽいですが、私はそっち方面に疎いので……node.jsかRubyでやってみようかな(小声