フォーム送信用にオブジェクト URL をファイルまたは BLOB に変換する方法

オブジェクト URL からのファイルまたは BLOB の取得

Web アプリケーションで画像を操作する場合、ドラッグ アンド ツールを使用するのが一般的です。ドロップまたはその他のメソッドを使用して、ユーザーがファイルをアップロードできるようにします。これらの画像を表示するには、通常、URL.createObjectURL を使用して画像をオブジェクト URL に変換します。ただし、これらの画像をフォームの一部として送信するとなると、次のような疑問が生じます。これらのオブジェクト URL をファイルまたは BLOB に変換して、FormData オブジェクトに追加するにはどうすればよいでしょうか?

Modernソリューション

最新のブラウザーは、シンプルで効率的なソリューションを提供します。

<code class="javascript">let blob = await fetch(url).then(r => r.blob());</code>

このコードは、オブジェクト URL と通常の URL の両方からファイルまたは BLOB をフェッチするために使用できます。 URL パラメーターには、前に作成したオブジェクト URL を指定できます。

Blob を取得したら、それを FormData オブジェクトに簡単に追加して、フォームを送信できます。以下に例を示します:

<code class="javascript">// Assume you have the Blob from the object URL
const formData = new FormData();
formData.append('image', blob);

// Submit the form via AJAX or another mechanism
fetch('/upload', {
  method: 'POST',
  body: formData
});</code>

以上がフォーム送信用にオブジェクト URL をファイルまたは BLOB に変換する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。