码迷,mamicode.com
首页 > 移动开发 > 详细

vue + axios 实现图片上传 简单版

时间:2020-03-24 11:04:39      阅读:149      评论:0      收藏:0      [点我收藏+]

标签:二进制流   new   headers   请求   let   图片上传   参数   div   ios   

uploadImg(img) { // img  =>  base64图片地址
      let param = new FormData(); //创建form对象
      param.append(‘multipartFile‘, this.dataURLtoBlob(img));// base64 转  二进制流   multipartFile => 后端要求的参数
      this.$axios({
        method: ‘post‘,  // post 方式
        url: ‘/ss-minprogram/uploads‘,  // 接口地址
        headers: { // 设置请求头
          "Content-Type": "multipart/form-data"
        },
        data: param  // 参数
      }).then((re) => { // 成功

      }).catch((err) => { // 异常

      })
    },
    //base64 转二进制流
    dataURLtoBlob(dataurl) {
      var arr = dataurl.split(‘,‘), mime = arr[0].match(/:(.*?);/)[1],
        bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
      while (n--) {
        u8arr[n] = bstr.charCodeAt(n);
      }
      return new Blob([u8arr], { type: mime });
    },

 

vue + axios 实现图片上传 简单版

标签:二进制流   new   headers   请求   let   图片上传   参数   div   ios   

原文地址:https://www.cnblogs.com/skydragonli/p/12557214.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!