uniapp用post上传图片流binary

注意:

1.uniapp对request请求有封装,会对入参进行格式化,如果想post主体为图片流,不能直接用;

2.传binary需要将路径转为base64,再转为二进制流blob


引入图片路径转base64

import {pathToBase64} from "image-tools";

选择图片时转base64

        uni.chooseImage({
          count: 1, //最多可以选择的图片张数				  count: 1, //默认100
          extension:['.jpg','.png','.jpeg','.gif','.svg','.webp','.jfif','.bmp','.dpg'],
          sizeType: ['compressed'], //original 原图,compressed 压缩图
          sourceType: ['album', 'camera'], //album 从相册选图,camera 使用相机
          //成功则返回图片的本地文件路径列表 tempFilePaths
          success: (res) => {
            this.imageList = this.imageList.concat(res.tempFilePaths);//成功后利用concat方法追加到imageList1中
            //循环遍历res.tempFilePaths将每一个图像路径转换为base64
            for (var i = 0; i < res.tempFilePaths.length; i++) {
              pathToBase64(res.tempFilePaths[i])
                .then(path => {
                  this.baseImageList = this.baseImageList.concat(path);//成功后利用concat方法追加到baseImageList中
                })
                .catch(error => {
                  console.error(error)
                })
            }
          }
        })

base64转二进制流


      /**
       * Base64字符串转二进制流
       * @param {String} dataurl Base64字符串(字符串包含Data URI scheme,例如:data:image/png;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,
        });
      },

请求接口


      async upload(url, binary){
        var xhr = new XMLHttpRequest();
        xhr.open("POST", url, false);
        xhr.overrideMimeType("application/octet-stream");
        //直接发送二进制数据
        if(xhr.sendAsBinary){
          xhr.sendAsBinary(binary);
        }else{
          xhr.send(binary);
        }
        // 监听变化
        if(xhr.status===200){
          // 响应成功
          return  xhr.response
        } else {
          this.$utils.showToast(xhr.responseText, "none")
          return;
        },

 上传至服务器

let url = '**************'
          let file = this.base64toFile(this.baseImageList[0], url);
          let fileid = '';
          let result = await this.upload(url, file);

你可能感兴趣的:(uni-app,http,网络协议,post二进制流)