3

我正在使用 ASP.NET Web API 来构建具有下载文件方法的 Web 服务（和站点）原型。当前端的用户按下导出按钮时，控制器会发出并接收 jQuery ajax GET 请求，然后控制器会调用名为 Excel 的方法（如下所示）。该方法运行没有任何问题并完成。当我在 Chrome 中查看标题时（请参阅https://skydrive.live.com/redir?resid=2D85E5C937AC2BF9!77093），它会收到带有（就我而言）所有正确标题的响应。

我使用的是基本身份验证，因此用户凭据是使用我使用 Ajax 选项手动添加到每个 jQuery Ajax 请求的 http 授权标头传输的。

var excelRequest = $.ajax({
    url: 'http://localhost:59390/api/mycontroller/excel',
    cache: false,
    type: 'GET',
    data: gridString,
    dataType: 'json',
    contentType: 'application/json; charset=utf-8'
});

$.ajaxSetup({
    beforeSend: function (xhr) {
        SetAuthRequestHeader(xhr)
    }
});

function SetAuthRequestHeader(jqXHR) {
    var usr = "Gebruiker2"; // TODO: Change, this is for testing only.
    var pw = "Wachtwoord23";
    jqXHR.setRequestHeader("Authorization", "Basic " + Base64.encode(usr + ":" + pw));
}

我的原型有一些我应该提到的特征：

  • 在授权标头中使用基本身份验证

  • Web 服务和调用该服务的网站位于不同的域中，因此我使用了 CORS 并将以下内容添加到 web.config

<httpProtocol>
    <customHeaders>
        <add name="Access-Control-Allow-Origin" value="*" />
        <add name="access-control-allow-headers" value="Content-Type, Authorization, Accept" />
        <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" 
    </customHeaders>
</httpProtocol>

下面显示的是整个 Excel 方法。

    [HttpGet]
    // Get api/myController/excel 
    public HttpResponseMessage Excel(string sidx, string sord, int page, int rows, string Depot, string PDID, string User, string Property, string Value)
    {
        if (AuthHelper.AuthService.HasValidCredentials(Request))
        {
            var gridResult = this.GetDataJqGridFormat( sidx,  sord,  page,  rows,  Depot,  PDID,  User,  Property,  Value);

            // Generate a HTML table.
            StringBuilder builder = new StringBuilder();
            // We create a html table:
            builder.Append("<table border=1>");
            builder.Append("<tr><td>DEPOT</td>");
            builder.Append("<td>PDID</td>");
            builder.Append("<td>USER</td>");
            builder.Append("<td>PROPERTY</td>");
            builder.Append("<td>VALUE</td></tr>");
            // Create response from anonymous type            
            foreach (var item in gridResult.rows)
            {
                builder.Append("</tr>");
                builder.Append("<tr>");
                builder.Append("<td>" + item.cell[0] + "</td>");
                builder.Append("<td>" + item.cell[2] + "</td>");
                builder.Append("<td>" + item.cell[3] + "</td>");
                builder.Append("<td>" + item.cell[4] + "</td>");
                builder.Append("<td>" + item.cell[5] + "</td>");
            }
            builder.Append("</table>");

            HttpResponseMessage result = new HttpResponseMessage(HttpStatusCode.OK);
            result.Content = new StringContent(builder.ToString());
            result.Content.Headers.ContentType = new MediaTypeHeaderValue("application/octet-stream");                                
            result.Content.Headers.ContentDisposition = new ContentDispositionHeaderValue("attachment");
            result.Content.Headers.ContentDisposition.FileName = "file.xls";

            return result;
        }
        else
        {
            throw ForbiddenResponseMessage();
        }

    }

这是也应该返回文件的标题： https ://skydrive.live.com/redir?resid=2D85E5C937AC2BF9!77093

我想要的是在我调用指向 excel 方法的 url 时下载文件。我不明白为什么它不会下载。甚至可以通过这种方式下载文件吗？

4

1 回答 1

9

好吧，我想通了。为了节省您的阅读时间，不可能按照我想要的方式进行。

首先，我无法使用 jQuery Ajax 下载文件。正如我已经预料（或担心）的那样，无法使用 Ajax 下载文件。这是出于安全考虑。请参阅为什么无法使用 ajax 请求下载文件？

但我仍然需要下载文件。有了上述知识，解决方案/解决方法似乎很简单。

我将执行 ajax 调用的 javascript 函数更改为以下内容：

    var gridInfo = {
    sidx: "",
    sord: "asc",
    nd: 1371046879480,
    rows: 50,
    page: 1
}
var payLoad = "?" + PrepareSearchQueryString() + "&" + serialize(gridInfo);

window.location= "http://site:59390/api/mycontroller/excel" + payLoad

但这仅涵盖了部分问题，因为我需要设置授权标头。

感谢 Stackoverflow 用户 SLaks 回答了我的相关问题（使用 javascript 设置标题），我能够找到带有用户名和密码的 url，看起来像https://user:password@domain.com/path?query可能是一个解决方案。可悲的是，它没有用。IE 不接受它，并且在使用它的 Chrome 中找不到授权标头。

由于我也在使用 jqGrid，因此我能够使用 jqGrid 设置授权头。在网站上使用搜索功能时，这非常有效。我的 Javascript 导出函数现在看起来像这样：

    var sUrl = "http://localhost:59390/api/Wmssettings/excel" + "?" + PrepareSearchQueryString() ;
$("#gridOverview").jqGrid('excelExport', { url: sUrl });

但是在查看请求时，我注意到与使用搜索功能时不同，没有传递授权标头。我确实找到了原因。在查看 jqGrid 源代码时，我注意到 Grid 只是在做一个 window.location 来指向下载位置。并且当这样做时，没有办法传递基本的身份验证信息。

所以我唯一能走的路，就是我试图避免的路。我更改了我的控制器方法以返回一个包含指向文件的 url 的 json，然后我使用 javascript 重定向到一个名为 downloadcontroller 的新控制器。

控制器 Excel 方法

        [HttpGet]
    // Get api/wmssettings/excel 
    public HttpResponseMessage Excel(string sidx, string sord, int page, int rows, string Depot, string PDID, string User, string Property, string Value)
    {
        if (AuthHelper.AuthService.HasValidCredentials(Request))
        {
            var gridResult = this.GetDataJqGridFormat(sidx, sord, page, rows, Depot, PDID, User, Property, Value);

            // Generate a HTML table.
            StringBuilder builder = new StringBuilder();
            // We create a html table:
            builder.Append("<table border=1>");
            builder.Append("<tr><td>DEPOT</td>");
            builder.Append("<td>PDID</td>");
            builder.Append("<td>USER</td>");
            builder.Append("<td>PROPERTY</td>");
            builder.Append("<td>VALUE</td></tr>");
            // Create response from anonymous type            
            foreach (var item in gridResult.rows)
            {
                builder.Append("</tr>");
                builder.Append("<tr>");
                builder.Append("<td>" + item.cell[0] + "</td>");
                builder.Append("<td>" + item.cell[2] + "</td>");
                builder.Append("<td>" + item.cell[3] + "</td>");
                builder.Append("<td>" + item.cell[4] + "</td>");
                builder.Append("<td>" + item.cell[5] + "</td>");
            }
            builder.Append("</table>");

            // Put all in a file and return the url:
            string fileName = "export" + "_" + Guid.NewGuid().ToString() + ".xls";
            using (StreamWriter writer = new StreamWriter(HttpContext.Current.Server.MapPath("~/Downloads" + fileName)))
            {
                writer.Write(builder.ToString());
                writer.Flush();                    
            }
            HttpResponseMessage result = Request.CreateResponse(HttpStatusCode.OK, fileName);
            return result;
        }
        else
        {
            throw ForbiddenResponseMessage();
        }
    }

JavaScript 导出方法

    var gridParams = {
    //"nd": Math.floor((Math.random() * 10000000) + 1),
    sidx: "",
    sord: "asc",
    page: "1",
    rows: "50"        
}   

payLoad = PrepareSearchQueryString() + "&" + serialize(gridParams);

var excelRequest = $.ajax({
    url: 'http://localhost:59390/api/Wmssettings/excel',
    cache: false,
    type: 'GET',
    data: payLoad,
    dataType: 'json',
    contentType: 'application/json; charset=utf-8'
});

excelRequest.success(function (data, code, jqXHR) {
    if (data == null) {
        alert('sd');
        ShowErrorMessage("There was no file created.", "", "Title");
    } else {
        window.location = 'http://localhost:59390/api/download/?fileName=' + data;
    }
});

我在我的 WebApiConfig.cs 中添加了以下行

            config.Routes.MapHttpRoute("Downloadcontroller", "api/{controller}/{action}", 
             new { action = "Get"}, new { httpMethod = new HttpMethodConstraint(allowedVerbsGet), controller="download"});

最后是下载控制器：

    public class DownloadController : ApiController
{
    [HttpGet]
    public HttpResponseMessage Get(string fileName)
    {
        HttpResponseMessage result = new HttpResponseMessage(HttpStatusCode.OK);
        string fileLocation = HttpContext.Current.Server.MapPath("~/Downloads" + fileName);

        if (!File.Exists(fileLocation))
        {
            throw new HttpResponseException(HttpStatusCode.OK);
        }

        Stream fileStream = File.Open(fileLocation, FileMode.Open);
        result.Content = new StreamContent(fileStream);

        result.Content.Headers.ContentType = new MediaTypeHeaderValue("application/vnd.ms-excel");
        result.Content.Headers.ContentDisposition = new ContentDispositionHeaderValue("attachment");
        return result;
    }
}

可以得出以下结论：

  • 无法使用 Ajax 下载文件，而是我必须重定向到精确的文件位置或另一个控制器。

  • 在 IE 中不允许将用户名和密码放在 url 中，并且似乎在其他浏览器中会出现问题。例如，在 Chrome 中，授权标头保持为空。

  • 执行 window.location 时，无法传递其他标头，例如基本身份验证所需的授权标头。

就是这样。答案是我想做的事情不可能以我喜欢的方式实现。它现在工作正常。

于 2013-06-14T07:40:48.787 回答