django1.8+angularjs实现前端点击下载excel/csv

业务需求,页面点击后将后端的queryset写入文件返回给前端下载

前端代码js是抄的,找不到出处了

            $http.get("url", { responseType: "arraybuffer" })
                .success( function(data, status, headers) {
                                   var success = false;
                    // Get the headers
                    headers = headers();
                    // Get the filename from the x-filename header or default to "eventlog"
                    var filename = headers['x-filename'] || 'eventlog.csv';
                    // Determine the content type from the header or default to "application/octet-stream"
                    var contentType = headers['content-type'];

                    // Get the blob url creator
                    var urlCreator = window.URL || window.webkitURL;
                    if(urlCreator)
                    {
                        // Try to use a download link
                        var link = document.createElement('a');
                        if('download' in link)
                        {
                            // Try to simulate a click
                            try
                            {
                                // Prepare a blob URL
                                console.log("Trying download link method with simulated click ...");
                                var blob = new Blob([data], { type: contentType });
                                var url = urlCreator.createObjectURL(blob);
                                link.setAttribute('href', url);
                                // Set the download attribute (Supported in Chrome 14+ / Firefox 20+)
                                link.setAttribute("download", filename);
                                // Simulate clicking the download link
                                var event = document.createEvent('MouseEvents');
                                event.initMouseEvent('click', true, true, window, 1, 0, 0, 0, 0, false, false, false, false, 0, null);
                                link.dispatchEvent(event);
                                console.log("Download link method with simulated click succeeded");
                                success = true;
                            } catch(ex) {
                                console.log("Download link method with simulated click failed with the following exception:");
                                console.log(ex);
                            }
                        }
                        //此处省略其他情况代码(我没用到)
                    }
                })
                .error(function(data, status) {
                    var decodedString = String.fromCharCode.apply(null, new Uint8Array(data));
                    var obj = JSON.parse(decodedString);
                    var message = obj['message'];
                    toastr.error(message);
                    // Optionally write the error out to scope
                    $scope.errorDetails = "Request failed with status: " + status;
                });

后端代码(python2):

				response = HttpResponse(content_type='text/csv')  # 告诉浏览器是text/csv格式
                writer = csv.writer(response)
                field_list = [ 'user']
                writer.writerow(field_list)

                for data in queryset:
                        writer.writerow([data.user])
                return response
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值