美文网首页
前端canvas截图上传

前端canvas截图上传

作者: 朱传武 | 来源:发表于2020-06-12 13:05 被阅读0次

截图blob转换成base64:

export const getBlobWithUrl=(url)=>{
  return new Promise((resolve,reject)=>{
    var xhr = new XMLHttpRequest();
    xhr.open('GET', url, true);
    xhr.responseType = 'blob';
    xhr.onload = function(e) {
    if (this.status == 200) {
       let blob = this.response;let reader = new FileReader();
       reader.onload=function(e) {
           resolve(e.target.result);
       }
       reader.readAsDataURL(blob);
   // myBlob is now the blob that the object URL pointed to.
   }
 };
 xhr.send();
  });
}

blob/base64 转成file

export const dataURLtoFile=(dataurl)=> {
  let 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 File([u8arr],`${new Date().getTime()}.jpg`, {type:mime});
}

文件上传:

export const upLoadFile=(ImageFile)=> {
 return new Promise((resolve,reject)=>{
  let formData = new FormData();
  formData.append("file", ImageFile);
  formData.append("file_prefix", "hanbang");
  let request = new XMLHttpRequest();
  request.open("POST", `https://wxqrcode.3vyd.com/store/file/upload`);
  request.setRequestHeader("authorization", token);
  request.onload = function(e) {
    if (this.status == 200) {
          resolve(e.target.response);
    } else {
      reject(e);
    }
   }
  request.send(formData);
 });
}

相关文章

网友评论

      本文标题:前端canvas截图上传

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