文档首页> 应用魔方 AppCube> 常见问题> 脚本开发> 如何用脚本导出xls文件让用户下载?
更新时间:2022-04-01 GMT+08:00
分享

如何用脚本导出xls文件让用户下载?

AppCube提供了“excel”脚本标准库,用于操作Excel文件,例如生成Excel文件。由于AppCube脚本编排的标准输出格式是JSON,因此这里需要做一些特殊处理,让系统生成非JSON数据才能实现xlsx文件导出。

  1. 登录到AppCube开发环境,在首页“项目”下“我的应用”中,单击一个应用,进入该应用开发工作台。
  2. 将光标放在某个文件夹(例如Logic)上,单击界面上出现的“+”,在弹出菜单中选择“脚本”。
  3. 在弹窗中,选中“创建一个新脚本”,在“名称”文本框中输入“cube__download”,单击“添加”。
  4. 在代码编辑器中插入如下脚本代码。

    import * as excel from 'excel';
    import * as context from 'context';
    import * as buffer from 'buffer';
    
    export class Downlaod {
    
        @action.method({ input: "Input", output: "Output", description: "do a operation" })
        run(): void {
            // 原始数据,可以从数据表中获取,此处为了演示方便,使用静态数据
            let binary = excel.encode(['a', 'b', 'c'], [{ 'a': 1, 'b': 2, 'c': 3 }, { 'a': 4, 'b': 5, 'c': 6 }, { 'a': 7, 'b': 2, 'c': 3 }]);
    
            // 对于 Excel2007 以上版本的 .xlsx 文件,需要设置内容类型为 application/vnd.openxmlformats-officedocument.spreadsheetml.sheet
            context.getHttp().response.setHeader('Content-Type', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;base64');
            // 直接把二进制作为请求体返回       
     context.getHttp().response.setBody(buffer.fromBytes(binary).toString(buffer.Encoding.Base64));
        }
    }

    此时,后端返回了一个base64编码的二进制数据,并非JSON格式,所以直接运行脚本不会有输出。需要在前端页面匹配处理这种数据才行。

  5. 在标准页面上调用“cube__download”脚本。为了简化配置,此处没有把脚本封装为公共接口,实际使用时业务应该使用公共接口进行封装以便实现更细粒度的权限控制。

    以jQuery的ajax方法为例,代码如下:

    var url = "/u-route/baas/script/v1.0/run/cube__download";
    
    context.$utils.getCSRFToken().then(function(token) {
        $.ajax({
            type: "POST",
            headers: {
                'Content-Type': "application/json",
                'responseType':"arraybuffer",
                'csrf-token': token,
            },
            url: url,
            data: JSON.stringify({}),
            dataType: 'text',
            async: false,
            success: function(resp){
                var fileName = "test" + '.xlsx';
                var file = new Blob([s2ab(atob(resp))], {type: ''});
                if (window.navigator.msSaveOrOpenBlob) { //IE浏览器下载
                    window.navigator.msSaveOrOpenBlob(file, fileName);
                } else {  
                    var fileUrl = URL.createObjectURL(file);
                    var a = document.createElement('a');
                    a.href = fileUrl;
                    a.target = '_blank';
                    a.download = fileName;
                    document.body.appendChild(a);
                    a.click();
                }
            },
            error: function(resp){
            }
        });
    });

    s2ab()是数据处理的关键,这个方法名字是“string to array buffer”的缩写,意思是把字符串转换为ArrayBuffer类型,以便让前端可以处理二进制数据。其函数定义如下:

    function s2ab(s) {
        var buf = new ArrayBuffer(s.length);
        var view = new Uint8Array(buf);
        for (var i=0; i!=s.length; ++i) {
            view[i] = s.charCodeAt(i) & 0xFF;
        }
        return buf;
    }

    上述代码中需要注意如下事项:

    • Header里面需要增加'responseType':"arraybuffer";
    • Header里的类型:dataType: 'text';
    • Header里增加csrf-token。

分享:

脚本开发所有常见问题

more

close