JavaScript を使用して BLOB をアップロードするにはどうすればよいですか?

Blob は Binary Large Object の略で、画像、音声、その他のマルチメディア オブジェクトなどのバイナリ データを保存するために使用されます。場合によっては、バイナリの実行可能コードも Blob として保存されます。

JavaScript を使用して、他のデータ ファイルと同様に BLOB をアップロードできます。

JavaScript では、XMLHttpRequest またはフェッチ API を使用して BLOB をアップロードできます。

＃＃＃１。 XMLHTTPRequest の使用

XMLHttpRequest (XHR) は、Web ブラウザと Web サーバー間でデータを転送するメソッドを備えたオブジェクトのような API です。ブラウザの JavaScript 環境は、このオブジェクトを提供します。通常、Web サイトを再起動せずにデータを非同期に送受信するために使用されます。これにより、ダイナミックで使いやすく、高速な Web ページを楽しむことが可能になります。 ＃＃＃＃＃＃例＃＃＃

これは、XMLHttpRequest を使用して BLOB をアップロードする例です -

リーリー

ここでは、BLOB データを使用して、バックエンド API の /upload エンドポイントへの POST リクエストを作成します。サーバーが正常に応答した後、応答をログアウトします。

＃＃＃２。 GetAPI

を使用する

Fetch API を使用すると、サーバーにリクエストを送信し、サーバーからデータを取得できます。これは最新の Web ブラウザに組み込まれており、GET および POST リクエストの作成に使用できます。 Fetch API は fetch() メソッドを使用し、Response オブジェクトに解決される Promise を返します。 Response オブジェクトを使用して、サーバーから返されたデータにアクセスできます。 Fetch API は、古い XMLHttpRequest API の代替としてよく使用され、より最新でユーザー フレンドリーです。また、Web ページをホスティングしているサーバー以外のサーバーにリクエストを送信するために使用できるため、より多用途です。

これは、フェッチを使用して BLOB をアップロードする例です -

リーリー

このようにして、サードパーティのライブラリを使用せずに、XMLHTTPRequest またはフェッチ API を使用して、フロントエンドのバニラ JavaScript からサーバーに BLOB データをアップロードできます。

以上がJavaScript を使用して BLOB をアップロードするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。