浏览器下载本地数据

场景:已经拿到了数据,非直接下载,示例为下载csv文件

ie和非ie下载不同

ie下载:

// 当执行如下代码,会生产“文件名字.csv"的文件,csv跟excel是一样的。
let data = new Blob(['a, b, c, \naa, bb, cc'], {type: 'text/csv'}) // Blob转换为二进制数据,类型为text/csv 第一个参数\n为换行,逗号为换列。 navigator.msSaveBlob(data, '文件名字.csv')

非ie

方式一:
let a = document.createElement('a') // 创建a标签 a.download = '文件名字.csv' // 下载后文件名字 let data = new Blob(['a, b, c, \naa, bb, cc'], {type: 'text/csv'}) a.href = URL.createObjectURL(data) // 转换为url地址 document.body.appendChild(a) // 添加a标签 a.click() // a标签点击

方式二: 不转换二进制
let a =document.createElement('a')
a.download = '文件名字.csv'
a.href= 'data:text/csv;charset=utf-8,' + encodeURI('a, b, c, \naa, bb, cc') // 使用dataUrl:   data:test/csv 其中data为dataUrl的头 text/csv为类型 分号表示第二个参数 逗号过后添加参数。
document.body.appendChild(a)
a.click()


补充: 

Blob([data], {type: 'application/json'})  其中data是字符串或者arraybuffer,返回blob对象

reader = new FileReader: reader为读取文件的对象,reader.readAsArrayBuffer(data)  其中data为 file(input.files[x])或者blob

URL.createObjectURL(blob) 可以将blob 转换为可以使用的url 

posted @ 2017-11-15 18:14  吃个石头  阅读(403)  评论(0编辑  收藏  举报