AngularJS 无刷新下载文件
发布日期:2021-10-16 12:05:05 浏览次数:8 分类:技术文章

本文共 1836 字,大约阅读时间需要 6 分钟。

/*** Excel文件下载*/MetronicApp.service('ExcelFileDownLoad', ['$http',function($http) {
this.downLoad = function(url, data, fileName){
$http({ url: url, //请求文件地址,服务端返回的是二进制数据流 method: 'post', responseType: 'arraybuffer', //防止乱码 contentType: 'application/json', data: data }).success(function (data, status, headers) {
//使用{type: "application/vnd.ms-excel"}的写法,可以保存为xls格式的excel文件(兼容老版本)。而使用“application/vnd.openxmlformats-officedocument.spreadsheetml.sheet”则会保存为xlsx //客户端接收后转换为指定文件格式的blob,最后创建blob对象的URL let blob = new Blob([data], {type:'application/vnd.ms-excel'}, decodeURI(headers(){
'x-filename'})); //把它放在A标签的href上 就会自动下载了 var anchor = angular.element(''); // 创建a元素 anchor.attr({ href: URL.createObjectURL(blob), //blob对象的URL放在a链接上就自动下载 target: '_blank', download: fileName })[0].click(); //当前元素绑定单击事件 }) }}])···ExcelFileDownLoad.downLoad("/downloadExcel", $scope.vo, "标题")
知识点:blob —在客户端处理二进制数据的js对象类型,包含二进制数据的容器

认识blob对象

input标签有一个上传文件的类型,type=’file’,当用户点击上传文件后,会返回一个FileList对象,file对象就存在于FileList对象中,file对象继承自blob。

// 参数一:需要被处理的数据序列,可以是任意格式的值;参数二:配置的参数,指定MIME类型let blob = new Blob([data], {type: "application/vnd.ms-excel"});// 属性// 1、blob.size  ; 对象中所包含的数据的大小(字节)// 2、blob.type  ; 一个字符串,表明该Blob对象所包含数据的MIME类型。如果类型未知,则该值为空字符串。// 方法// 1、blob.slice([index, length, contentType]) ;返回一个新的 Blob 对象,包含了源 Blob 对象中指定范围内的数据// 分片上传文件的案例let chunk = 1024 * 1024;   // 每个文件切片大小定为1MBlet file = document.getElementById("file"); //获取input文件initUpload();function initUpload(){
file.onchange = function(){
let blob = file.files[0]; let blobs = []; if(blob){ for(let i=0;i

转载地址:https://blog.csdn.net/snow51/article/details/81120794 如侵犯您的版权,请留言回复原文章的地址,我们会给您删除此文章,给您带来不便请您谅解!

上一篇:RN 打android离线包生成apk文件
下一篇:IntelliJ Idea 常用快捷键列表

发表评论

最新留言

第一次来,支持一个
[***.219.124.196]2024年04月11日 10时48分52秒