ユーザーがテキストエリアの現在のコンテンツを自分のコンピューターのテキストファイルにダウンロードできるようにしたい。以前は、データを含むURLを指すiframeを作成しました。これにより、ファイルのダウンロードダイアログがトリガーされました。ただし、今回のデータはクライアント側です。
では、サーバー側に送信せずにユーザーにデータをダウンロードさせることは可能ですか?
ユーザーがテキストエリアの現在のコンテンツを自分のコンピューターのテキストファイルにダウンロードできるようにしたい。以前は、データを含むURLを指すiframeを作成しました。これにより、ファイルのダウンロードダイアログがトリガーされました。ただし、今回のデータはクライアント側です。
では、サーバー側に送信せずにユーザーにデータをダウンロードさせることは可能ですか?
IEのような「古いブラウザ」で動作する必要がない場合は、場所を指定して新しいウィンドウを開くことができます'data:text/plain,' + yourTextarea.value
。Ctrlその後、ユーザーは[ファイル/ページ]メニューまたは+を使用してそのファイルを保存できますS。
サーバー側に送信せずにユーザーにデータをダウンロードさせることは可能ですか?
一般的な場合はありません。
data:
janmoesenの回答のようにURLで可能です(ただし、URLに含める値をURLエンコードする必要があります。そうしないと%nn
、データにシーケンスが表示されたときに破損する可能性があります)。
ただし、これは非常に長いデータでは実用的ではなく、古いブラウザやIEでは使用できません。(IE8では短いデータURLを画像に使用できますが、直接ナビゲーションはできません。)したがって、データURLメソッドを含めて、それをサポートするブラウザーでのプロセスを強化することはできますが、それでも、データをサーバー側に送信し、それに応じてファイルを吐き戻します。
(セキュリティ上の理由から、これはPOST
リクエストでのみ許可する必要があり、サーバーはレスポンスに含める必要がありますContent-Disposition: attachment
。コンテンツエコースクリプトを使用すると、クロスサイトスクリプティングの問題が発生する可能性があります。)
プログラムで作成してダウンロードをトリガーできます。
https://blog.logrocket.com/programmatic-file-downloads-in-the-browser-9a5186298d5c/