目录
最近在项目中碰到了需要下载json的,由于后端已经将json以字符串的方式发送到了前端。
这里只需要将拿到的String下载下来就好。在这里记录一下。
解释
JSON 通常是用于与服务端交换数据。
JSON.parse方法将数据转换为 JavaScript 对象。
let jsondata = JSON.parse(res.returnJson)
JSON.stringify(value, replacer, space)
value:必需。需要转换的JavaScript的值(通常为对象或数组)
replacer:可选。用于转换结果的函数或数组。
space:可选。文本添加缩进,空格和换行符。如果space是一个数字,则返回文本在每一个级别缩进指定数目的空格,如果space大于10,则文本缩进10个空格。space也可以使用非数字,如‘\t’。
const 声明一个只读的常量,一旦声明,常量的值就不能改变。
const urlObject = window.URL || window.webkitURL || window;
URL对象是硬盘(SD卡等)指向文件的一个路径,如果我们做文件上传的时候,想在没有上传服务器端的情况下看到上传图片的效果图的时候就可是以通过var url=window.URL.createObjectURL(obj.files[0]);获得一个http格式的url路径,这个时候就可以设置到<img>中显示了。 window.webkitURL和window.URL是一样的,window.URL标准定义,window.webkitURL是webkit内核的实现(一般手机上就是使用这个),还有火狐等浏览器的实现。
const export_blob = new Blob([内容],{type:文件类型});
{type: "application/zip"},
excel下载{type: "application/vnd.ms-excel"},
导出下载{ type: 'application/octet-stream' }
const save_link = document.createElementNS("http://www.w3.org/1999/xhtml", "a");
createElementNS(namespaceURI,qualifiedName[,options]);
创建一个具有指定的命名空间 URI 和限定名称的元素。
namespaceURI:指定与元素相关联的命名空间URI的字符串。
qualifedName:指定要创建的元素类型的字符串。
返回值:新元素
save_link.href = urlObject.createObjectURL(export_blob);
参数:用于创建 URL 的 File 对象、Blob 对象或者 MediaSource 对象。
返回值:一个DOMString包含了一个对象 URL,该 URL 可用于指定源 object
的内容。
save_link.download = "jsonfile";
等号后为文件名。
具体代码
具体代码如下:
.then(res => {
if (res.msg = "保存json成功") {
let jsondata = JSON.parse(res.returnJson)
let showjson = JSON.stringify(jsondata, null, '\t')
// console.log(showjson)
//点击后下载json文件
const urlObject = window.URL || window.webkitURL || window;
const export_blob = new Blob([showjson]);
const save_link = document.createElementNS("http://www.w3.org/1999/xhtml", "a");
save_link.href = urlObject.createObjectURL(export_blob);
save_link.download = "jsonfile";
const ev = document.createEvent("MouseEvents");
ev.initMouseEvent("click", true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0,
null);
save_link.dispatchEvent(ev);
}