mygoodcool

mygoodcool

爱过、错过,不忘初心。

Cloudflare R2を使用して、ゼロコストで画像ホスティングを構築する

本文では、Cloudflare が最近導入した新しいサービスである R2 について紹介します。これは S3 API と互換性のある無料のクラウドストレージサービスであり、ユーザーはグローバルな分散ネットワーク上でデータを保存および取得することができます。R2 は「トラフィック料金のないオブジェクトストレージ」として位置づけられ、オブジェクトストレージの中で最も安価な選択肢であると主張しています。他のクラウドストレージサービスと比較して、R2 はデータアクセス時にトラフィック料金を計算せず、ストレージ容量と操作回数に基づいてのみ料金を請求します。どのクラウドベンダーがこれをやる勇気があるでしょうか!

また、R2 のストレージネットワークは、275 の都市にまたがる 100 以上の国に広がっており、Cloudflare の大規模なコンテンツデリバリーネットワーク(CDN)を利用してデータのグローバル配信と高速アクセスを実現しています。同時に、Cloudflare Workers とのネイティブ統合も可能であり、ユーザーは簡単に認証を実行し、リクエストをルーティングし、Cloudflare のエッジネットワーク上にエッジ関数をデプロイすることができます。

🦄 無料プラン
CF 公式ウェブサイトによると、各 CF アカウントは無料で R2 サービスを利用することができますが、もちろんいくつかの制限があります。月間のストレージは 10GB まで無料で、さらに月間 100 万回の A クラス操作と 1000 万回の B クラス操作が付属しています。A クラス操作は主に書き込み操作であり、B クラス操作は主に読み取り操作です。私たちが日常的に R2 内のコンテンツにアクセスするのは B クラス操作ですが、1000 万回は個人の日常的な使用に十分です。さらに、CF のキャッシュと組み合わせると、使用量はさらに少なくなります!

Cloudflare R2

🦌 操作方法
R2 を使用するには、まず CF アカウントを登録する必要があります(Free プランを選択してください)、そして最も良いのは CF 上で独自のドメインを解析することです。

1️⃣ ストレージバケットの作成
左側のメニューで R2 を見つけて、概要を開き、右上の「ストレージバケットの作成」をクリックします。
Cloudflare R2

ストレージバケットの名前を入力し、バケットの場所を選択します(アクセスが最も多い地域に配置することをお勧めします。たとえば、ユーザーが多いのは美しい国なので、北アメリカを選択します)。デフォルトのストレージクラスは「標準」を選択します。

Cloudflare R2

2️⃣ ストレージバケットの設定
作成が完了したら、概要ページに戻り、作成したばかりのバケットを開き、設定をクリックします。

Cloudflare R2

下にスクロールして、「公開アクセス」セクションを見つけ、リンクドメインをクリックします。このバケットに独自のドメインを設定します。

Cloudflare R2

自分のサブドメインを入力し、例えば imghub.yourdomain.com など、続行ボタンをクリックします。

Cloudflare R2

しばらく待つと、CF は自動的に R2 の DNS レコードに R2 タイプのレコードを追加します。これは CF 内部専用のものであり、気にする必要はありません。とにかく、これで R2 に保存された画像にアクセスするためにこのドメインを使用できるようになりました。

Cloudflare R2

3️⃣ キャッシュの設定
R2 には月間 1000 万回の無料の読み取り回数がありますが、心配な場合はキャッシュを追加することもできます。これにより、オリジンへのリクエスト回数が減少し、アクセス速度が向上します。一石二鳥です!CF の各ドメインは無料で 10 個のキャッシュルールを設定できますが、通常は十分です。少しのテクニックを使えば、それほど多くは使用しません。

メニューで「キャッシュ」を見つけて、キャッシュルールを開き、ルールを作成をクリックします。

Cloudflare R2

ルール名(任意)を入力し、マッチングルールを設定します。ここでは、ホスト名が前述で設定したドメインである場合に直接設定します。もちろん、他の多くのマッチングルールも選択できます。等しい、含む、開始、終了などの演算子をサポートし、CDN 対象のリソースを設定するために実際の状況に合わせて設定してください。

Cloudflare R2

次に、キャッシュの資格を満たすように設定します。エッジ TTL で「キャッシュ制御ヘッダを無視し、この TTL を使用する」を選択し、生存時間(TTL)で時間を選択します。無料アカウントでは最短 2 時間、最長 1 年がサポートされていますが、画像ホスティングの場合はできるだけ大きな値を選択し、オリジンへのリクエスト(R2 ストレージバケットの B クラス操作回数)を減らすことをお勧めします。

Cloudflare R2

最後に、ページの最下部までスクロールし、デプロイをクリックし、30 秒待って有効になります。これであなたの画像ホスティングは CDN 上で実行されます。

Cloudflare R2

4️⃣ 画像のアップロード
筆者が画像ホスティングを構築すると言っても、R2 には画像のみを保存することを意味するわけではありません。制限はありませんので、誤解しないでください。

さて、画像ホスティングができたら、どのように画像をアップロードしますか?先ほど述べたように、R2 は S3 互換のクラウドストレージサービスであり、既存の S3 対応ツールを直接使用することができます。もちろん、手間をかけたくない場合は、R2 のストレージバケットのインターフェースで直接アップロードすることもできます。
Cloudflare R2

PicGO を使用してアップロードする
ストレージバケットの設定画面で、バケットの場所を確認します。たとえば、アジア太平洋地域の場合は APAC です。メモしておくと後で使います。

Cloudflare R2

アカウント ID の下に「R2 API トークンの管理」ボタンがありますので、クリックして API トークンを作成します。

Cloudflare R2

作成ページでトークン名を入力し、アクセス権限をオブジェクトの読み取りと書き込みに設定し、他の設定はデフォルトのままにして、最後に作成を確認します。

Cloudflare R2

その後、このトークンに関連する情報がページに表示されます。トークン値、アクセスキー ID、およびシークレットアクセスキーは 1 回だけ表示され、このページを閉じると表示されなくなるので、それらを個別に記録し、他の人と共有しないように注意してください!

Cloudflare R2

次に、PicGO のプラグイン設定で S3 を検索し、S3 プラグインをインストールします。

Cloudflare R2

プラグインのインストールが完了したら、設定を開始します。アクセスキー ID、アクセスキー、バケット名、ファイルパス、カスタムドメインをそれぞれ入力します。他の項目は入力しなくてもかまいませんが、実際の状況に合わせて設定してください。設定が完了したら、画像を正常にアップロードできます。

フィールドの対応関係は以下の表の通りです:

プラグインのフィールド CF のフィールドまたは意味
アクセスキー ID アクセスキー ID
アクセスキー シークレットアクセスキー
バケット名 R2 ストレージバケット名
ファイルパス デフォルトまたは独自の定義
カスタムドメイン あなたの R2 のデフォルトドメインまたは前述で設定したカスタムドメイン
Cloudflare R2

以上は PicGO を使用して R2 に画像をアップロードする方法の簡単な紹介です。他の S3 互換のツールを使用する場合も基本的に同じですが、筆者はあまり多くの経験がないため、詳細は省略します。R2 を使用した画像ホスティングのチュートリアルはここまでです。

要するに、最初から最後まで、1 セントもかかりませんでした!

読み込み中...
文章は、創作者によって署名され、ブロックチェーンに安全に保存されています。