JavaScript/jQuery で JSON データを使用して POST 経由でファイルをダウンロードするにはどうすればよいですか?

JavaScript/jQuery で JSON データを使用して POST 経由でファイルをダウンロードする

RESTful Web サービスを扱う場合、JSON とダウンロード可能なバイナリ応答の両方を処理するクライアント側は共通の課題です。この記事では、JavaScript と jQuery を使用してこれを実現する方法について説明します。

望ましいシナリオには、JSON データを含む POST リクエストを REST エンドポイントに送信することが含まれます。リクエストのパラメータに応じて、レスポンスは JSON データまたはダウンロード可能なファイルのいずれかになります。これに対処するために、いくつかのオプションを検討します。

AJAX の使用:

最初のアプローチは、jQuery $.ajax() 関数を使用することです。ただし、AJAX リクエストの dataType オプションは、JSON を含む特定のデータ型のみをサポートします。これは、AJAX を使用してファイルを直接ダウンロードすることはできないことを意味します。

サーバー上でのファイル URL の生成:

別の方法は、サーバーにダウンロード可能な URL を生成させることです。ファイルを開き、ファイルへの URL を含む JSON 応答を返します。その後、クライアントはこの URL を使用してダウンロードを開始できます。この方法には複数のサーバー呼び出しが必要ですが、理想的ではない可能性があります。

iFrame の使用:

より最適な解決策は、iFrame を使用することです。 POST リクエストを送信した後、クライアント アプリの本体で iFrame を作成し、その src 属性を指定された URL に設定できます。 iFrame がロードされると、ブラウザはユーザーにファイルをダウンロードするよう求めます。

<code class="javascript">$.post('/create_binary_file.php', postData, function(retData) {
  $("body").append("<iframe src="%22%20+%20retData.url+%20%22" style="display: none;"></iframe>");
});</code>

iFrame メソッドの利点:

• サーバー側の処理を簡素化します。
• ダウンロードを開始する前に追加情報 (ファイル サイズ、生成時間など) を取得できます。
• JSON とバイナリ ファイルの両方の応答と互換性があります。 .

考慮事項:

• このメソッドでは、サーバーが JSON 応答でダウンロード URL を提供する必要があります。
• ファイル悪意のある使用を防ぐために、URL は一時的なものである必要があります。
• ブラウザの互換性は異なる場合があり、display: none スタイルでは問題が発生する場合があります。

以上がJavaScript/jQuery で JSON データを使用して POST 経由でファイルをダウンロードするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。