コンテンツにスキップ

直接クリエイターアップロードを受け入れる

Cloudflare Imagesの直接クリエイターアップロード機能を使用すると、ユーザーはAPIキーやトークンをクライアントに公開することなく、一度限りのアップロードURLを使用して画像をアップロードできます。直接クリエイターアップロードを使用することで、中間ストレージバケットやそれに関連するストレージ/エグレスコストが不要になります。

一度限りのアップロードURLをリクエストする

以下の例を参考にして、direct_uploadエンドポイントにPOSTリクエストを行います。

Terminal window
curl --request POST \
https://api.cloudflare.com/client/v4/accounts/{account_id}/images/v2/direct_upload \
--header "Authorization: Bearer <API_TOKEN>" \
--form 'requireSignedURLs=true' \
--form 'metadata={"key":"value"}'

リクエストが成功すると、以下の例のようなレスポンスが返されます。idフィールドは、クリエイターによってアップロードされる将来の画像識別子です。

{
"result": {
"id": "2cdc28f0-017a-49c4-9ed7-87056c83901",
"uploadURL": "https://upload.imagedelivery.net/Vi7wi5KSItxGFsWRG2Us6Q/2cdc28f0-017a-49c4-9ed7-87056c83901"
},
"result_info": null,
"success": true,
"errors": [],
"messages": []
}

エンドポイントを呼び出した後、新しいドラフト画像レコードが作成されますが、画像は画像のリストには表示されません。画像レコードのステータスを確認したい場合は、direct_uploadエンドポイントを使用して一度限りのアップロードURLにリクエストを行うことができます。

画像レコードのステータスを確認する

新しいドラフト画像レコードのステータスを確認するには、以下の例のように一度限りのアップロードURLを使用します。

Terminal window
curl https://api.cloudflare.com/client/v4/accounts/{account_id}/images/v1/{image_id} \
--header "Authorization: Bearer <API_TOKEN>"

リクエストが成功すると、以下の例のようなレスポンスが返されます。draftフィールドは、クリエイターが画像をアップロードするまでtrueに設定されています。画像がアップロードされると、ドラフトフィールドは削除されます。

{
"result": {
"id": "2cdc28f0-017a-49c4-9ed7-87056c83901",
"metadata": {
"key": "value"
},
"uploaded": "2022-01-31T16:39:28.458Z",
"requireSignedURLs": true,
"variants": [
"https://imagedelivery.net/Vi7wi5KSItxGFsWRG2Us6Q/2cdc28f0-017a-49c4-9ed7-87056c83901/public",
"https://imagedelivery.net/Vi7wi5KSItxGFsWRG2Us6Q/2cdc28f0-017a-49c4-9ed7-87056c83901/thumbnail"
],
"draft": true
},
"success": true,
"errors": [],
"messages": []
}

バックエンドエンドポイントは、クライアントにuploadURLプロパティを返す必要があり、これにより画像をアップロードする際に認証情報を渡す必要がなくなります。

以下は、一度限りのアップロードURLを取得し、ユーザーが選択した任意の画像をアップロードするHTMLページの例です。

<!DOCTYPE html>
<html>
<body>
<form
action="INSERT_UPLOAD_URL_HERE"
method="post"
enctype="multipart/form-data"
>
<input type="file" id="myFile" name="file" />
<input type="submit" />
</form>
</body>
</html>

デフォルトでは、uploadURLは未使用の場合、30分後に期限切れになります。このオプションを上書きするには、cURLコマンドに以下の引数を追加します。

--data '{"expiry":"2021-09-14T16:00:00Z"}'

期限値は、最小2分、最大6時間先でなければなりません。

カスタムIDを使用した直接クリエイターアップロード

一度限りのアップロードURLをリクエストする際に、自動生成されたIDの代わりにカスタムIDを指定できます。カスタムIDを持つ画像は、署名付きURLトークン機能(--requireSignedURLs=true)でプライベートにすることはできませんので注意してください。

カスタムIDを指定するには、以下の例のようにIDという名前のフォームフィールドと対応するカスタムID値を渡します。

--form 'id=this/is/my-customid'