【OSS】使用Browser.js SDK时如何上传base64编码的图片?-问答-阿里云开发者社区-阿里云

开发者社区> 问答> 正文

【OSS】使用Browser.js SDK时如何上传base64编码的图片?

来自:阿里云内容设计中心 2022-01-19 17:15:33 1462 1

使用Browser.js SDK时如何上传base64编码的图片?

取消 提交回答
全部回答(1)
  • cattt
    2022-01-19 17:29:51
    已采纳

    2000元阿里云代金券免费领取,2核4G云服务器仅689元/3年,新老用户都有优惠,立即抢购>>>

    base64先转码成指定格式图片,然后调用OSS上传接口进行上传。更多信息,请参见Github示例

    /**
     * base64 to file
     * @param dataurl   base64 content
     * @param filename  set up a meaningful suffix, or you can set mime type in options
     * @returns {File|*}
     */
    const dataURLtoFile = function dataURLtoFile(dataurl, filename) {
      const arr = dataurl.split(',');
      const mime = arr[0].match(/:(.*?);/)[1];
      const bstr = atob(arr[1]);
      let n = bstr.length;
      const u8arr = new Uint8Array(n);
      while (n--) {
        u8arr[n] = bstr.charCodeAt(n);
      }
      return new Blob([u8arr], { type: mime });// if env support File, also can use this: return new File([u8arr], filename, { type: mime });
    };
    
    // client表示OSS client实例
    const uploadBase64Img = function uploadBase64Img(client) {
      // base64格式的内容
      const base64Content = 'data:image:xxxxxxxxxxxxx';
      const filename =  'img.png';
      const imgfile = dataURLtoFile(base64Content, filename);
      //key表示上传的object key ,imgFile表示dataURLtoFile处理后返回的图片
      client.multipartUpload(key, imgfile).then((res) => {
        console.log('upload success: %j', res);
      }).catch((err) => {
        console.error(err);
      });
    };
                
    
    0 0
相关问答

45

回答

★★CT团队出品:Ftp4oss阿里云OSS最好用的FTP云工具、客户端和文件同步工具

ftp4oss 2013-08-30 19:47:43 89905浏览量 回答数 45

119

回答

OSS存储服务-客户端工具

newegg11 2012-05-17 15:37:18 300824浏览量 回答数 119

43

回答

【精品问答集锦】Python热门问题

小六码奴 2019-05-30 15:27:34 142628浏览量 回答数 43

82

回答

OSS入门教程

belle.zhoux 2014-07-07 17:14:27 158070浏览量 回答数 82

88

回答

手把手教你搭建自己的OSS FTP 服务器

lei.zhuol 2012-05-16 14:48:33 91263浏览量 回答数 88

8

回答

全线HTTPS 阿里云OSS一键签发绑定免费SSL证书图文教程

51干警网 2018-08-16 13:44:36 85602浏览量 回答数 8

13

回答

【云服务器分享】如何节省网站流量

dreamdoo 2012-10-15 10:36:09 81424浏览量 回答数 13

24

回答

【精品问答】python技术1000问(1)

问问小秘 2019-11-15 13:25:00 483087浏览量 回答数 24

27

回答

阿里云开源软件镜像站点上线啦!!

qilu 2014-01-06 18:14:06 97078浏览量 回答数 27

2

回答

区域选择帮助

fanyue88888 2012-12-07 15:54:30 205372浏览量 回答数 2
+关注
5
文章
343
问答
来源圈子
更多
问答排行榜
最热
最新
相关电子书
更多
OceanBase 入门到实战教程
立即下载
阿里云图数据库GDB,加速开启“图智”未来.ppt
立即下载
实时数仓Hologres技术实战一本通2.0版(下)
立即下载
http://www.vxiaotou.com