ホームページ > 記事 > ウェブフロントエンド > ノードフェッチ/フォームデータを Node.js ネイティブ API に移行する
Node v16.15.0 および v17.5.0 のリリースでは、Fetch API と FormData が導入されました。それ以前は、Node.js でブラウザーのような API を使用するために、node-fetch パッケージと form-data パッケージが使用されていました。ノードフェッチ/フォームデータ パッケージを Node.js ネイティブ API に移行するには、サードパーティ パッケージのインポート ステートメントを削除することでいくつかの変更を加えることができますが、ファイルなどの Node.js 機能を使用するときに留意すべき重要な考慮事項があります。システム。この記事では、node-fetch/form-data パッケージから Node.js ネイティブ API への移行について概要を説明します。
import fs from 'node:fs'; -import FormData from 'form-data'; -import fetch from 'node-fetch'; -const file = fs.createReadStream('secret.txt'); +const file = await fs.openAsBlob('secret.txt', { type: 'text/plain' }); const form = new FormData(); -form.append('file', file); +form.append('file', file, 'secret.txt'); const response = await fetch('https://example.com/upload', { method: 'POST', body: form, });
form-data パッケージと Node.js FormData には互換性がないため、Fetch API で直接渡すことはできません。 form-data をネイティブ Fetch API に渡す場合、リクエスト本文は文字列 [object FormData] になります。
import FormData from 'form-data'; const form = new FormData(); await fetch('https://example.com/upload', { method: 'POST', body: form, }); // [object FormData]
form-data パッケージは、Node.js の fs.ReadStream を受け入れます。ネイティブ API は、ブラウザー互換の BLOB を受け入れます。ファイルから BLOB を作成するには、Node.js v19.8.0 で追加された fs.openAsBlob() を使用します。 fs.ReadStream をネイティブ API の FormData に渡すと、値は [object Object] になります。
import fs from 'node:fs'; const file = fs.createReadStream('secret.txt'); const form = new FormData(); form.append('file', file); // Content-Disposition: form-data; name="file" // // [object Object]
form-data パッケージは、fs.ReadStream からファイル名を取得し、それをファイル名フィールドとして使用します (内部実装)。また、ファイル名からファイル タイプを判断し、Content-Type ヘッダー (内部実装) を設定します。
Blob にはファイル名がないため、手動で指定する必要があります。 Content-Type が指定されていない場合、ネイティブ API の FormData はデフォルトで application/octet-stream になります。 Content-Type は fs.openAsBlob() の引数から明示的に指定できます。
const file = await fs.openAsBlob('secret.txt'); const form = new FormData(); form.append('file', file); // Content-Disposition: form-data; name="file"; filename="blob" // Content-Type: application/octet-stream
const file = await fs.openAsBlob('secret.txt', { type: 'text/plain' }); const form = new FormData(); form.append('file', file, 'secret.txt'); // Content-Disposition: form-data; name="file"; filename="secret.txt" // Content-Type: text/plain
Node.js v21.0.0よりFetch APIとFormDataがStability: 2 (安定版)になりました。 fs.openAsBlob() は、Node.js の最新バージョン (2024 年 7 月 27 日時点で v22.5.1) ではまだ安定性: 1 (実験的) です。古いランタイムで実行する場合や、機能変更の可能性がある実験的な API を使用する場合は注意が必要です。
以上がノードフェッチ/フォームデータを Node.js ネイティブ API に移行するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。