美文网首页
js-文件的上传和下载

js-文件的上传和下载

作者: hello_web_Front | 来源:发表于2021-02-22 09:59 被阅读0次

上传采用的是FormData https://developer.mozilla.org/zh-CN/docs/Web/API/FileReader/readAsDataURL
下载采用的是a标签的形式

import Axios from 'axios'

class Utils {
    downloadFile(url, params) {
        Axios.get(url, {
            params,
            responseType: "blob",
            headers: {
                Authorization: localStorage.getItem("token"),
            }
        }).then(res => {
            if (res.data) {
                let urls = window.URL.createObjectURL(res.data);
                let link = document.createElement("a");
                link.style.display = "none";
                link.setAttribute("download", "export.xls");
                link.href = urls;
                document.body.appendChild(link);
                link.click();
            }
        })
    }
    uploadFile(file, url) {
        return new Promise((resolve, reject) => {
            if (file) {
                let formData = new FormData();
                formData.append("file", file);
                Axios.post(url, formData, {
                    headers: {
                        "Content-type": "multipart/form-data",
                        Authorization: localStorage.getItem("token"),
                    }
                }).then(resolve).catch(reject)
            } else {
                reject(new Error('没有上传文件!'))
            }
        })
    }
}
export default new Utils();

import Utils from '../../Utils/Utils.js'
使用:

 // 下载
  let obj = Object.assign({}, this.queryInfo);
 // download.downloadFile("api/manager/corInvoice/export",obj)
 // 上传
 download.uploadFile(file, "api/manager/corInvoice/import")
        .then((res) => {
          if (res.status == 200) {
            this.$message.success("导入文件成功!");
            this.initTable();
          }
        })
        .catch((err) => {
          console.log(err);
        });

相关文章

  • js-文件的上传和下载

    js-文件的上传和下载

  • js-上传/下载文件

    上传 为什么常用FormData对象来上传file 还可以用base64, 见下文。 Content-Type a...

  • java文件下载上传

    文件上传 App图片上传 html文件上传 文件下载 文件下载 版本控制 xml版本控制

  • SSH上传下载命令

    上传文件 下载文件 上传目录 下载目录

  • 文件上传和下载

    一.项目用到的图片上传的关键方法:直接使用android-async-http.jar 二、文件下载 1.普通单线...

  • 文件上传和下载

    iview的upload组件中上传前添加提示信息,确认后再进行上传https://blog.csdn.net/we...

  • 文件上传和下载

    一、概论 在Web应用系统开发中,文件上传和下载功能是非常常用的功能,今天来讲一下JavaWeb中的文件上传和下载...

  • 文件上传和下载

    文件上传 文件上传涉及到前台页面的编写和后台服务器端代码的编写,前台发送文件,后台接收并保存文件,这才是一个完整的...

  • 文件上传与下载

    文件上传和下载 文件上传和下载是JAVA WEB中常见的一种操作,文件上传主要是将文件通过IO流传输到服务器的某一...

  • SpringMVC之文件上传和下载

    十一、文件上传和下载 目录:准备工作、文件上传、文件下载 1.准备工作 文件上传是项目开发中最常见的功能之一,Sp...

网友评论

      本文标题:js-文件的上传和下载

      本文链接:https://www.haomeiwen.com/subject/lyjhfltx.html