hiroblue’s LIFE LOG

🎯 Backblaze B2 + Cloudflare 完全無料帯域幅設定ガイド

このガイドでは、Backblaze B2の低コストストレージ（$0.005/GB）とCloudflareの帯域幅同盟を活用し、 ダウンロード転送料金を完全無料化する方法を解説します。

🔧 準備するもの

• Backblazeアカウント（ 無料登録 ）

• Cloudflareアカウント（ 無料登録 ）

• 独自ドメイン（例: example.com）

🚀 ステップ1: Backblaze B2バケットの作成

1. Backblaze B2ダッシュボード にログイン

1. 「バケットを作成」をクリック

1. 設定項目を入力：
   
   
   • バケット名: 任意の名前（例: my-music-bucket）
   
   
   • ファイルのプライバシー: 公開を選択
   
   
   • 暗号化: デフォルトのまま
   
   
   

1. 「バケットを作成」ボタンをクリック

💡 ポイント: バケット作成後「バケット情報」で f000.backblazeb2.com のような「フレンドリーURL」をメモしておきます

📤 ステップ2: MP3ファイルをB2にアップロード

1. 作成したバケットを選択

1. 「ファイルをアップロード」をクリック

1. MP3ファイルを選択してアップロード

1. アップロード後、ファイル名をクリックして「ファイル情報」を開く

1. ファイルのURLをコピー（例: https://f003.backblazeb2.com/file/my-music-bucket/song.mp3 ）

🌐 ステップ3: Cloudflare DNS設定

1. Cloudflareダッシュボード にログイン

1. 使用するドメインを選択

1. 左メニューで「DNS」を選択

1. 新しいレコードを追加：
   
   
   • タイプ: CNAME
   
   
   • 名前: サブドメイン（例: music）
   
   
   • ターゲット: B2のフレンドリーURL（例: f003.backblazeb2.com）
   
   
   • プロキシステータス: プロキシ済み（オレンジの雲）
   
   
   

1. 「保存」をクリック

⚠️ 注意: プロキシステータスが「DNSのみ（グレーの雲）」だと帯域幅無料化が適用されません

🔐 ステップ4: SSL/TLS設定

1. Cloudflareダッシュボードで「SSL/TLS」を選択

1. 「概要」タブで 暗号化モードを「Full」に設定

1. 「Edge Certificates」タブを開く

1. 「常にHTTPSを使用」を オンにする

1. 「TLS 1.3」を有効化

🔄 ステップ5: URLリライトルールの作成

1. Cloudflareダッシュボードで「ルール」→「Transform Rules」を選択

1. 「URLの書き換え」タブで「ルールを作成」

1. ルール名を入力（例: B2 Rewrite）

1. 「ルールが一致したとき」フィールドに以下を入力：
   

    (http.host eq "music.example.com") 
   

1. 「書き換えアクション」で以下を選択：
   
   
   • タイプ: パスを動的に書き換え
   
   
   • 式:
     

      concat("/file/my-music-bucket", http.request.uri.path) 
     

   
   
   

1. 「デプロイ」ボタンをクリック

💡 ポイント: my-music-bucket は実際のバケット名に置き換えてください

⚙️ ステップ6: キャッシュ設定の最適化

1. Cloudflareダッシュボードで「キャッシュ」→「構成」を選択

1. 「キャッシュの有効期限」セクションで：
   
   
   • 「標準」を選択
   
   
   • 「期限切れになるまでの期間」で 7日間を設定
   
   
   

1. 「ページルール」を選択

1. 新しいルールを作成：
   
   
   • URL: music.example.com/*.mp3
   
   
   • 設定項目：
     
     
     • 「キャッシュレベル」: キャッシュのすべて
     
     
     • 「エッジキャッシュ有効期限TTL」: 7日間
     
     
     • 「オリジンキャッシュ制御をバイパス」: オン
     
     
     
   
   
   

🎵 ステップ7: Webプレイヤーでの再生確認

HTML5 audioタグを使用した再生例：

 <audio controls>
<source src="https://music.example.com/song.mp3" type="audio/mpeg">
お使いのブラウザはオーディオタグをサポートしていません
</audio> 

実際の動作確認手順：

1. 上記コードをWebページに追加

1. ブラウザで再生テスト

1. 開発者ツール（F12）の「ネットワーク」タブで確認：
   
   
   • リクエストURLが music.example.com 経由になっている
   
   
   • レスポンスヘッダーに cf-cache-status: HIT が表示される
   
   
   

✅ 設定完了チェックリスト

• B2バケットが「公開」設定になっている

• Cloudflare DNSのCNAMEレコードが「プロキシ済み」

• SSL/TLSモードが「Full」

• Transform Rulesで正しいバケット名を指定

• MP3ファイルにキャッシュ設定が適用されている

🔍 よくあるトラブルと解決策

問題	原因	解決方法
403 Forbiddenエラー	バケットが非公開	B2バケット設定で「公開」に変更
CORSエラー	オリジン未許可	B2のCORS設定にドメイン追加
キャッシュが効かない	Cache-Controlヘッダ不足	ページルールでTTL強制設定

💎 この設定のメリット

• 帯域幅費用完全無料: Cloudflare経由のトラフィックは課金対象外

• 高速配信: CloudflareのグローバルCDNで世界中から高速アクセス

• 高耐久性: データの99.999999999%耐久性を維持

• 無料枠活用: 10GBまで永久無料ストレージ

この設定により、月間1TBの音楽配信でも 帯域幅費用は$0になります。初期設定後は自動的にスケールするため、ユーザー増加に伴うインフラコストを心配する必要がありません。

🎉 設定完了後のおすすめアクション

1. Backblaze B2の監視アラートを設定

1. Cloudflare Analyticsでトラフィックを監視

1. B2バケットのアクセスログを有効化

1. 定期的なファイル整合性チェックを設定

以上の手順で、高品質な音楽配信サービスを最小コストで構築できます。問題が発生した場合は、Cloudflareの「トラブルシューティング」ツールやBackblazeの「サーバーサイドログ」で詳細なエラー情報を確認してください。

---

​
OD＞Cloudflare　Workers＋Pagesで旅行メモのサイトを作って （技術の泉シリーズ） [ 木村俊彦（プログラミング） ] ​​

Cloudflare Workers+Pagesで旅行メモのサイトを作ってみよう！【電子書籍】[ 木村 俊彦 ]

​