mcpField
U
upload-r2

upload-r2

github.com/remotion-devクラウド・DevOps68.6k594 回インストール今日更新
リポジトリ

upload-r2 について

大きなメディア素材を Git に追加せず、Remotion の公開メディアホスティングにアップロードするためのワークフロースキルです。R2 の認証情報と Bun の S3 互換クライアントを使ったアップロード、確認、参照の更新手順を示します。

主な機能

  1. 01parser-media バケットへの素材アップロード
  2. 02サイズによる既存オブジェクトの確認
  3. 03公開 URL の検証
  4. 04ローカル素材参照の置き換え

活用シーン

  1. 01大きなメディアを Git リポジトリ外でホスティング
  2. 02ローカルのバイナリをホスト済み素材に置き換え

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/remotion-dev/remotion --skill upload-r2

インストール後、Claude Code で/upload-r2を入力して読み込まれたか確認します。

詳細

R2 アセットのアップロード

Git にコミットするのではなく、https://remotion.media/ でホストする大容量のメディアアセットに使用します。

ワークフロー

  1. メインのワークツリーを見つけます：

    git worktree list --porcelain

    refs/heads/main 上のワークツリーを優先してください。通常は /Users/jonathanburger/remotion です。

  2. メインのワークツリーから R2 の認証情報を読み込みます：

    --env-file=/Users/jonathanburger/remotion/packages/remotion-media/.env

    シークレット値を出力しないでください。必要な変数は AWS_ACCESS_KEY_ID と AWS_SECRET_ACCESS_KEY です。

  3. Bun の S3 互換クライアントを使用して、ファイルを parser-media バケットにアップロードします：

    bun --env-file=/Users/jonathanburger/remotion/packages/remotion-media/.env -e "import {S3Client} from 'bun'; const filePath='<local-file>'; const key='<remote-file-name>'; const client=new S3Client({accessKeyId:Bun.env.AWS_ACCESS_KEY_ID, secretAccessKey:Bun.env.AWS_SECRET_ACCESS_KEY, endpoint:'https://2fe488b3b0f4deee223aef7464784c46.r2.cloudflarestorage.com', bucket:'parser-media'}); const file=Bun.file(filePath); if (await client.exists(key)) { const stat=await client.stat(key); if (stat.size===file.size) { console.log('exists-same-size', key, file.size); process.exit(0); } } await client.write(key, file); const stat=await client.stat(key); console.log('uploaded', key, stat.size);"

  4. 公開 URL を確認します：

    curl -I --fail https://remotion.media/<remote-file-name>

  5. ローカルアセットの使用箇所をホスト URL に置き換え、ローカルのバイナリファイルを削除します。

    リモート URL を staticFile() でラップしないでください。staticFile() は http:// および https:// の URL を受け付けません。次の例のように、URL 文字列を直接使用してください：

    <Video src="https://remotion.media/example.mp4" />

  6. 変更したパッケージに絞って lint または stylecheck を実行し、コミットしてプッシュします。

コメント

Markdown 対応