如何通过 Jquery 调用 MVC FileContentResult 并让它提示用户保存它的返回?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/9821856/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How can I call an MVC FileContentResult by Jquery and get it to prompt the user to save on it's return?
提问by Andy Clarke
I'm generating a CSV from an MVC 3 website and using a FileContentResult to pass this to the user. This worked great but it took 30 seconds for the csv to generate and therefore 30 seconds before the prompt to save was given to the user.
我正在从 MVC 3 网站生成 CSV 并使用 FileContentResult 将其传递给用户。这很有效,但生成 csv 需要 30 秒,因此在向用户提示保存之前需要 30 秒。
public virtual FileContentResult GetSpreadsheet(string id)
{
var service = new SpreadsheetService();
var result = service.GetCSV();
return File(new System.Text.UTF8Encoding().GetBytes(result.Message), "text/csv", "Report123.csv");
}
So I thought I'd just call it via JQuery - but this (unsurprisingly!) just dumps the CSV to the page.
所以我想我只是通过 JQuery 调用它 - 但这(不出所料!)只是将 CSV 转储到页面。
$.post("/Home/GetSpreadsheet/" + id, null, function (data) {
$('#resultDiv').html(data);
});
Does anyone know how I'd generate the prompt to save now I've got the data back? Thanks
有谁知道我现在如何生成保存提示我已经得到了数据?谢谢
回答by Darin Dimitrov
You can't do that. Forget about that. It is impossible to download files using AJAX. In fact the AJAX call will work, you will hit the server, the server will send the file contents back to the client, the AJAX success callback will be triggered and passed as argument the contents of the file and that's where everything ends for you. Using javascript you cannot, for absolutely obvious reasons, save directly the file to the client computer and you cannot prompt for the Save As dialog.
你不能那样做。把它给忘了。使用 AJAX 下载文件是不可能的。实际上,AJAX 调用将起作用,您将访问服务器,服务器将文件内容发送回客户端,将触发 AJAX 成功回调并将文件内容作为参数传递给您,这就是一切结束的地方。使用 javascript,出于绝对明显的原因,您无法将文件直接保存到客户端计算机,并且无法提示“另存为”对话框。
So instead of using AJAX simply create an anchor:
因此,不要使用 AJAX,只需创建一个锚点:
@Html.ActionLink("download spreadsheet", "GetSpreadsheet", new { id = "123" })
Now if the server set the Content-Disposition
header to attachment
the browser will prompt the user to download and save the file at some chosen location on his computer.
现在,如果服务器将Content-Disposition
标头设置attachment
为浏览器,则会提示用户下载文件并将其保存在计算机上的某个选定位置。
回答by Kibria
If you don't want to use an anchor, use a hidden iframe and set the src of the iframe to the url of the file to be downloaded.
如果不想使用锚点,可以使用隐藏的 iframe,并将 iframe 的 src 设置为要下载的文件的 url。
<iframe id="hiddenFrame" src="" style="display:none; visibility:hidden;"></iframe>
Instead of the '$.post(...)' line use:
而不是 '$.post(...)' 行使用:
downloadSpreadsheet('123');
function downloadSpreadsheet(id) {
var url = '@Url.Content("~/YourControllerName/GetSpreadsheet")' + "?id=" + id;
$('#hiddenFrame').attr('src', url);
}
Or you can give a try on the jQuery Plugin for Requesting Ajax-like File Downloads
或者您可以尝试使用jQuery Plugin for Requesting Ajax-like File Downloads
Using the plugin, you can download by invocking:
使用该插件,您可以通过调用下载:
jQuery.download(url, data, method)
回答by vapcguy
You can use this in JavaScript:
你可以在 JavaScript 中使用它:
function downloadSpreadsheet(id) {
window.location.href = '@Url.Action("GetSpreadsheet", "Home")?id=' + id;
}