JS原生实现下载json文件

/**
 * 下载Json工具
 * @param data
 * @param fileName
 */
export const saveAsJson = (str: string, fileName: string) => {
    //指定类型文件类型application/json;charset=utf-8
  const blob = new Blob([str], { type: "application/json;charset=utf-8" });
  const href = URL.createObjectURL(blob);
  const alink = document.createElement("a");
  alink.style.display = "none";
  alink.download = fileName; // 下载后文件名
  alink.href = href;
  document.body.appendChild(alink);
  alink.click();
  document.body.removeChild(alink); // 下载完成移除元素
  URL.revokeObjectURL(href); // 释放掉blob对象
};

  • 1
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
好的,关于 js 原生实现文件上传,一般可以使用 HTML5 新增的 FormData 对象和 XMLHttpRequest 对象的相关方法来实现。具体步骤如下: 1. 在 HTML 中添加一个表单,包含一个 `<input type="file">` 元素: ``` <form id="myForm"> <input type="file" name="myFile"> <input type="submit" value="Upload File"> </form> ``` 2. 在 JS 中获取表单元素并监听表单的 `submit` 事件: ``` const myForm = document.getElementById('myForm') myForm.addEventListener('submit', (event) => { event.preventDefault() // 阻止表单默认提交行为 const formData = new FormData(myForm) // 创建一个 FormData 实例 const xhr = new XMLHttpRequest() // 创建一个 XMLHttpRequest 实例 // TODO: 设置 xhr 的事件监听器、请求地址、请求方式等 xhr.send(formData) // 发送请求 }) ``` 3. 在 XMLHttpRequest 实例中设置相应的事件监听器,如 `onload`,`onerror`,`onabort` 等,以处理成功和失败的情况并取得响应数据: ``` xhr.onload = function() { if (this.status === 200) { const data = JSON.parse(this.response) // TODO: 处理响应数据,如显示上传成功的信息等 } else { // TODO: 处理非 200 响应码的情况,如显示上传失败的信息等 } } xhr.onerror = function() { // TODO: 处理请求错误的情况,如显示上传失败的信息等 } xhr.onabort = function() { // TODO: 处理请求被取消的情况,如显示上传被取消的信息等 } ``` 以上是一般的简单处理方式,还可以根据具体需求添加一些限制条件,如文件大小、文件类型、上传进度等。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值