文件下载但保存文件对话框未打开

Question

使用 ASP.NET、ExtJS5、SQL Server 和 ClosedXML。

我正在使用 ExtJS 调用数据库存储过程，并使用 ClosedXML 将结果保存到服务器上的 excel 文件中。

文件创建正确，查看网络检查器，我可以验证文件正在下载，但我没有收到任何Save 对话。我找到的只是禁用该弹出窗口的解决方案（我很想遇到这个问题）。

我在 Chrome、Firefox 和 IE 上都试过了，每个版本都一样。

调用服务的面板：

Ext.define('Table', {
    xtype: 'file-table',
    extend: 'Ext.grid.Panel',
    title: 'Stuff for Excel',
    hideHeaders: false,
    cls: 'striped-grid',
    store: 'Stuff for Excel Store',
    requires: [
        'Ext.grid.selection.SpreadsheetModel',
        'Ext.grid.plugin.Clipboard'
    ],
    selModel: {
        type: 'spreadsheet',
        rowSelect: false,
        columnSelect: true  
    },
    plugins: ['clipboard', 'gridfilters'],
    features: [{
        ftype: 'grouping',
        hideGroupedHeader: true,
        startCollapsed: true
    }],
    columns: [{
        text: '#1',
        dataIndex: 'Name',
        flex: 1,
        filter: {
            type: 'string',
            itemDefaults: {
                emptyText: 'Filter by...'
            }
        }
    }, {
        text: '#2',
        dataIndex: 'Type',
        flex: 1,
        hidden: true,
        filter: {
            type: 'string',
            itemDefaults: {
                emptyText: 'Filter by...'
            }
        }
    }, {
        text: '#3',
        dataIndex: 'Sub-Type',
        flex: 1,
        filter: {
            type: 'string',
            itemDefaults: {
                emptyText: 'Filter by...'
            }
        }
    }, {
        text: '#4',
        dataIndex: 'Sub-sub Type',
        flex: 1,
        filter: {
            type: 'string',
            itemDefaults: {
                emptyText: 'Filter by...'
            }
        }
    }, {
        text: '#5',
        dataIndex: 'Weight',
        xtype: 'numbercolumn',
        renderer: function (value) {
            var out = value * 100;
            return out.toFixed(1) + ' %';
        },
        flex: 0
    }],
    viewConfig: {
        stripeRows: true
    },
    bbar: [{
        xtype: 'panel',
        flex: 1
    }, {
        xtype: 'button',
        margin: 5,
        padding: 10,
        text: 'Export to Excel',
        hidden: false,
        flex: 0,
        icon: '../Images/ExportReport.png',
        handler: function () {
            Ext.Ajax.request({      
                method: 'GET',
                loadMask: true,
                url: 'ReportingWebServices.asmx/CreateExcel',
                params: {
                    'here': are,
                    'some': params
                }
            })
        }
    }]
});

相关的服务器端代码

[WebMethod]
[ScriptMethod(ResponseFormat = ResponseFormat.Json, UseHttpGet = true, XmlSerializeString = false)]
public void CreateExcel()
{
    string fileName = "Workbook.xlsx";
    string filePath = "path\to\file";
    ClosedXML.Excel.XLWorkbook workBook = new ClosedXML.Excel.XLWorkbook(); 

    // Passing params, getting results from database,
    // building the spreadsheet

    if (File.Exists(filePath + fileName))
    {
        File.Delete(filePath + fileName);
    }

    workBook.SaveAs(filePath + fileName);

    HttpContext.Current.Response.ClearContent();
    HttpContext.Current.Response.Clear();
    HttpContext.Current.Response.ContentType = "application/octet-stream";
    HttpContext.Current.Response.AddHeader("Content-Disposition", "attachment; filename=" + fileName + ";");
    HttpContext.Current.Response.TransmitFile(filePath + fileName);
    HttpContext.Current.Response.Flush();
    HttpContext.Current.ApplicationInstance.CompleteRequest();
}

Answer 1

@Gusman 的评论帮助我弄清楚了我可以在哪里寻找。问题确实出在前端代码中。我在按钮处理程序中添加了一个函数，该函数附加了一个不可见的 iframe。

 handler: function () {

            var fileName = 'fileName.xlsx'

            Ext.Ajax.request({      
                method: 'GET',
                loadMask: true,
                url: 'ReportingWebServices.asmx/GetExcel',
                params: {
                    'sessionId': reportingSelectedSessionGUID,
                    'userId': reportingSelectedUserGUID,
                    'timeId': reportingSelectedTimeGUID,
                    'hierarchyGroupId': reportingSelectedHierarchyGroupGUID,
                    'nodeId': reportingSelectedNodeGUID,
                    'memberId': reportingSelectedMemberGUID,
                    'fileName': fileName // Pass the filename to the controller
                },
                success: function (response, opts) {

                    Ext.DomHelper.append(Ext.getBody(), {
                        tag: 'iframe',
                        frameBorder: 0,
                        width: 0,
                        height: 0,
                        css: 'display:none;visibility:hidden;height:0px;',
                        src: '../Temp/' + fileName // Grab that same file that's created
                    });
                }
            })
        }

我还通过服务器代码进行了修改，将文件保存到服务器上的临时文件夹中，以供客户端检索。