15

.csvファイルをダウンロードするための次のコードがあります。

$.ajax({
    url: urlString,
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    cache: false,
    success: function(data) {
        if (data) {
            var iframe = $("<iframe/>").attr({
                src: data,
                style: "visibility:hidden;display:none"
            }).appendTo(buttonToDownloadFile);
        } else {
            alert('Something went wrong');
        }
    }
});

は、ファイルを生成し、iFrame の src 属性に割り当てられたファイル パスを返すurlStringRestful サービスを指しています。.csvこれはどの.csvファイルでも機能しますが、ファイルに問題があり.xmlます。

同じコードを使用しているが、を変更しcontentTypeてファイルtext/xmlのダウンロードに使用すると、.xmlこれは機能しません。

.xmlここでファイルに同じアプローチを使用できますか?

アップデート：

私を正しい方向に向けてくれたベンに感謝します。ajax 呼び出しはまったく必要ないことがわかりました。代わりに、iFrame とその url 属性を使用して Web サービスを呼び出すことができます。これにより、コンテンツが生成され、ヘッダー ( Content-Disposition) が追加され、ストリームが返されます。

4

2 に答える 2

19

データがクライアント側であっても、仮想アンカー要素からのダウンロードとして提供することもできます。

/*
 * Create an anchor to some inline data...
 */

var url = 'data:application/octet-stream,Testing%20one%20two%20three';
var anchor = document.createElement('a');
    anchor.setAttribute('href', url);
    anchor.setAttribute('download', 'myNote.txt');

/*
 * Click the anchor
 */

// Chrome can do anchor.click(), but let's do something that Firefox can handle too

// Create event
var ev = document.createEvent("MouseEvents");
    ev.initMouseEvent("click", true, false, self, 0, 0, 0, 0, 0, false, false, false, false, 0, null);

// Fire event
anchor.dispatchEvent(ev);

http://jsfiddle.net/D572L/

于 2014-02-06T02:20:11.193 に答える
16

問題は、ほとんどのブラウザーがブラウザー自体で XML をレンダリングしようとするのに対し、CSV のハンドラーを持たない傾向があるため、自動的にデフォルトでユーザーにファイルのダウンロードを促すことだと推測しています。XML ファイルのヘッダーを変更して、ダウンロードを強制してみてください。のようなもの (PHP の例):

header("Content-Type: application/force-download");
header("Content-Type: application/octet-stream");
header("Content-Type: application/download");
header('Content-Disposition: attachment; filename="some filename"');

これにより、ほとんどのブラウザはファイルを開こうとせず、代わりにユーザーにファイルをダウンロードさせ、OS がファイルの処理方法を決定できるようになります。

XML ファイル自体のヘッダーを制御する権限がない場合は、サーバー側スクリプトを使用して回避策を試すことができます。JS を使用して URL をサーバー側スクリプトに渡します。

//build the new URL
var my_url = 'http://example.com/load_file_script?url=' + escape(path_to_file);
//load it into a hidden iframe
var iframe = $("<iframe/>").attr({
    src: my_url,
    style: "visibility:hidden;display:none"
}).appendTo(buttonToDownloadFile);

サーバー側 (http://example.com/load_file_scriptスクリプト) では、cURL/ file_get_contents/ wgets/[リモート ファイルをフェッチする他のメカニズム] を使用して、リモート ファイルの内容を取得し、Content-Disposition: attachmentヘッダーとprint元のファイルのコードを追加します。

于 2013-05-28T19:06:05.730 に答える