Question

在我的asp.Net MVC 4项目中，我使用Excel导出功能，使用Javascript从客户端将HTML表格导出到Excel文件。

导出功能在Chrome和Firefox中正常工作，但在IE（任何浏览器）中均无效。在IE中它只是打开一个新窗口，并且没有发生。

我的javascript代码如下，

function Export(htmltable,filename) {
            var excelFile = "<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:x='urn:schemas-microsoft-com:office:excel' xmlns='http://www.w3.org/TR/REC-html40'>";
            excelFile += "<head>";
            excelFile += "<!--[if gte mso 9]>";
            excelFile += "<xml>";
            excelFile += "<x:ExcelWorkbook>";
            excelFile += "<x:ExcelWorksheets>";
            excelFile += "<x:ExcelWorksheet>";
            excelFile += "<x:Name>";
            excelFile += "{worksheet}";
            excelFile += "</x:Name>";
            excelFile += "<x:WorksheetOptions>";
            excelFile += "<x:DisplayGridlines/>";
            excelFile += "</x:WorksheetOptions>";
            excelFile += "</x:ExcelWorksheet>";
            excelFile += "</x:ExcelWorksheets>";
            excelFile += "</x:ExcelWorkbook>";
            excelFile += "</xml>";
            excelFile += "<![endif]-->";
            excelFile += "</head>";
            excelFile += "<body>";
            excelFile += htmltable.replace(/"/g, '\'');
            excelFile += "</body>";
            excelFile += "</html>";

            var base64data = "base64," + $.base64.encode(excelFile);
            window.open('data:application/vnd.ms-excel;'+ base64data);
 }

我还尝试命名该文件，例如：

window.open('data:application/vnd.ms-excel;filename=' + filename + ';' + base64data);

但仍然命名为'download.xls'。

如何解决这些问题。

我也发现了这些陈述，

如果您将Internet Explorer定位为浏览器，则必须寻找其他方法，因为当前的方法不起作用。从MSDN库中，数据协议主题说：

Data URIs are supported only for the following elements and/or attributes.

object (images only)
img
input type=image
link
CSS declarations that accept a URL, such as background, backgroundImage, 
and so on.

Data URIs can be nested.

For security reasons, data URIs are restricted to downloaded resources. Data URIs cannot be used for navigation, for scripting, or to populate frame or iframe elements.

有什么方法可以解决这个问题吗？

感谢任何帮助。

Answer 1

出于安全原因，如果IE不再支持以该格式生成文件，则需要更新版本。

我提出的解决方案（并针对IE进行了测试）是为您的MVC项目添加一个新的Generic Handler。在这个演示中，我命名了我的ashx处理程序＆＃34; Downloader.ashx＆＃34;。将此代码添加到通用处理程序：

    public void ProcessRequest(HttpContext context)
        {
            try
            {
                if (context.Request.QueryString.AllKeys.Contains("fileName"))
                {
                    StreamExcelorWordFile();
                }
            }
            catch (Exception ex)
            {
                HttpContext.Current.Response.Write(ex.Message.ToString());
            }
        }

        public void StreamExcelorWordFile()
        {
            string tableName = HttpContext.Current.Request.QueryString["fileName"].ToString();
            string extensions = HttpContext.Current.Request.QueryString["extension"].ToString();

            //HttpContext.Current.Response.ContentType = "application/force-download";

            string appType = "force-download";
            if (extensions == "xls")
            {
                appType = "vnd.ms-excel";
            }
            else if (extensions == "doc")
            {
                appType = "vnd.ms-word";
            }

            HttpContext.Current.Response.ContentType = "application/" + appType;
            HttpContext.Current.Response.AddHeader("Content-Disposition", "attachment;filename=" + tableName + "." + extensions);

            HttpContext.Current.Response.Write(HttpContext.Current.Request.Form["exportdata"].ToString().Replace("⌐", "<").Replace("¬", ">"));
        }

然后，将您的Javascript更改为类似的内容：

<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage" %>

<!DOCTYPE html>

<html>
<head runat="server">
    <meta name="viewport" content="width=device-width" />
    <title>Excel or Word Downloader</title>

     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

    <script type="text/javascript">
        function convertToXLS() {
            var rawHTML = '<table>' + $('#tblTest').html() + '</table>';

            Export(rawHTML, 'myExcelFile', 'xls');
        }

        function Export(htmltable, filename, extension) {
            var JsonHndlrx = "Downloader.ashx";

            htmltable = htmltable.replace(/</g, '⌐').replace(/>/g, '¬');

            $("body").append('<form id="exportform" action="' + JsonHndlrx + '?fileName=' + filename + '&extension=' + extension + '" method="post" target="_blank"><input type="hidden" id="exportdata" name="exportdata" /></form>');
            $("#exportdata").val(htmltable);
            $("#exportform").submit().remove();
            return true;
        }
    </script>
</head>
<body>
    <div>
        <table id="tblTest">
            <tr>
                <th>
                    Column1
                </th>
                <th>
                    Column2
                </th>
                <th>
                    Column3
                </th>
            </tr>
            <tr>
                <td>
                    locationA-1
                </td>
                <td>
                    locationA-2
                </td>
                <td>
                    locationA-3
                </td>
            </tr>
            <tr>
                <td>
                    locationB-1
                </td>
                <td>
                    locationB-2
                </td>
                <td>
                    locationB-3
                </td>
            </tr>
            <tr>
                <td>
                    locationC-1
                </td>
                <td>
                    locationC-2
                </td>
                <td>
                    locationC-3
                </td>
            </tr>
        </table>
    </div>
    <div>
        <input id="btnToExcelDownload" type="button" value="Convert Table To XLS" onclick="convertToXLS(); return false;" />
    </div>
</body>
</html>

Wolla！它应该适用于所有主要的浏览器，包括IE！

从javascript导出到Excel无法在IE中运行？

1 个答案: