はじめに
前回の動画で決済のワークフローを確認し、決済機能まで導入できました。残りは管理画面における動画の追加機能を実装していきます。
講座を作成した際の動画配信にはbunny.netを使っていきます。YouTubeを貼り付けるという選択肢もありますが、ブランドとしてYouTubeを使うと「無料で見れるのでは」という印象になってしまうので、動画ストレージからの配信のほうが個人的におすすめです。bunny.netはコストもそこまで高くないので、皆さんにもおすすめしていきたいと思います。
bunny.netのアカウント作成
「bunny.net」で検索して一番上のサイトをクリックします。新規登録はGoogleアカウントで簡単にできます。
登録すると、お試しで20ドル分のクレジットが配布されます。フリートライアルは14日間で、それを過ぎると従量課金になりますが、動画の配信と動画ストレージのみであれば、それほど高い料金ではありません。様々な動画ストレージサービスの中でも比較的安いほうです。
必要な情報
bunny.netの動画アップロード機能に必要なのは以下の3つです。
- Bunny API Key
- Bunny Library ID
- Bunny CDN Hostname
画像ストレージも使う場合は、もう1つ環境変数が必要になります。今回は動画ストレージだけでなく、画像ストレージもbunny.netで運用していきます。
ビデオライブラリの作成
Streamのビデオライブラリを作成します。
- 「Add Video Library」からビデオライブラリを作成
- ビデオライブラリ名を任意で設定(例:Video Platform)
- リージョンを選択 — 東京リージョンはないので、一番近いシンガポールを選択
- デフォルトでチェックが入っている項目は不要なので、チェックを外す
料金は1GBあたり0.02ドルと、非常に手頃です。
APIキーの取得
作成したビデオライブラリのページで「API」タブをクリックします。ここに必要な情報が表示されています。
- Video Library ID をコピー
- API Key をコピー
- Bunny CDN Hostname をコピー
セキュリティの注意点
これらのAPIキーは、そのままClaude Codeに渡しても動作しますが、セキュリティ的に不安な場合は.env.localファイルに直接貼り付けるようにしてください。
特に企業や本格的なサービスを展開する場合、Claude Codeに重要な情報を読み込ませないほうが安全です。.env.localファイルもClaude Codeに参照させない設定にしたほうがよいでしょう。
少し手間ですが、APIキーなどは自分で.env.localにコピペするほうが安全です。本格的なセキュリティについては別の講座で解説します。
動画アップロード機能の確認
3つの環境変数を設定したら、管理画面のレッスン編集画面から動画をアップロードできるようになります。
ファイルを選択するとアップロードが始まり、自分のアプリ上から動画をアップロードできるようになります。Udemyのように動画管理を自分のサービス内で完結できるのが大きなメリットです。
アップロード後はbunny.netの「Media Library」から確認できます。アップロード中は「Encoding」と表示されることがあるので、少し待ってから再生してみましょう。
注意:レッスン編集画面でアップロード後は、必ず「変更を保存」ボタンを押してください。これを押し忘れると変更が反映されません。
動画プレイヤーのカスタマイズ
bunny.netの動画プレイヤーは、見た目や機能を細かくカスタマイズできます。
- 言語を日本語(Japanese)に変更
- フォントの変更
- プレイヤーの色変更(オレンジなど)
- 10秒早送り機能
- キャプション表示
- 3倍速などの倍速設定
YouTube埋め込みよりも自由度の高いオリジナルプレイヤーを使えるのが魅力です。
字幕(トランスクリプション)機能
動画に字幕やテロップを入れたい場合は、Enable Transcriptingをオンにすると、自動で文字起こしと翻訳が行われます。
ただし、この機能はコストが高めです。私の場合、60〜70本の動画で7〜8千円程度かかりました。お金がかかってもいいから字幕やテロップを入れたいという場合は、オンにしてください。
この機能をオンにすると、自分が喋っている言葉を文字列として取得できます。実は、この記事のテキストもトランスクリプティング機能で取得した文章を、Claude Codeに誤字脱字を修正してもらって記事化したものです。テキスト編集を全部AIに任せられるので、字幕入りの動画講座を運営する場合は活用すると効率的です。
コストについて
動画を2本上げてもまだ0ドルで、コストはほとんどかかっていません。視聴ユーザーが増えると動画の帯域幅を使うのでコストは上がりますが、それは売上も上がっていることを意味します。動画ストレージは事業投資として、しっかりと払っていく価値があると考えています。
まとめ
bunny.netを使った動画ストレージの設定が完了しました。続いての動画では、サムネイル機能の実装や画像ストレージの設定に進んでいきます。