Использование jQuery и iFrame для загрузки файла

У меня есть следующий код для загрузки 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');
                }
            }
        });

URL-адрес urlString указывает на службу RESTful, которая генерирует CSV файл и возвращает путь к файлу, который присваивается атрибуту src для iFrame. Это работает для любых CSV файлов, но у меня проблемы с XML файлами. Когда я использую тот же код, но изменяя contentType на "text/xml" и использую его для загрузки XML файлов, это не работает.

Можно ли использовать тот же подход для файлов .xml?

UPDATE:

Спасибо Бен за то, что он указал мне в правильном направлении. Оказывается, мне вообще не нужен звонок ajax. Вместо этого я могу просто использовать iFrame и его атрибут url для вызова веб-службы, которая будет генерировать контент, добавлять заголовок (Content-Disposition) и возвращать поток.

Ответы

Ответ 1

Я предполагаю, что проблема в том, что большинство браузеров будут пытаться отображать 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"');

Это должно сказать большинству браузеров, что они не пытались открыть файл, но вместо этого пользователь должен загрузить файл и дать ОС определить, что с ним делать.

Если у вас нет полномочий для управления заголовками в самом файле XML, вы можете попробовать обход, используя серверную часть script. Используйте JS для передачи URL-адреса на стороне сервера script:

//build the new URL
var my_url = 'http://mysite.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://mysite.com/load_file_script script) вы используете cURL/file_get_contents/wgets/[какой-либо другой механизм выборки удаленных файлов], чтобы захватить содержимое удаленного файла, добавьте заголовки Content-Disposition: attachment и print код исходного файла.

Ответ 2

Вы также можете предложить его как загрузку с виртуального элемента привязки, даже если данные на стороне клиента:

/*
 * 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 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/