将字符串或图片转换成base64格式

将字符串或图片转换成base64格式

1、将图片转化成base64

注:这里的图片为服务端请求的图片(http://…png)

//  定义此方法, 将图片转化成base64
    getBase64Image(img) {
      var canvas = document.createElement("canvas");
      canvas.width = img.width;
      canvas.height = img.height;
      var ctx = canvas.getContext("2d");
      ctx.drawImage(img, 0, 0, img.width, img.height);
      var ext = img.src.substring(img.src.lastIndexOf(".") + 1).toLowerCase();
      var dataURL = canvas.toDataURL("image/" + ext);
      return dataURL;
    },
//  开始转化过程
    var image = new Image();
    image.setAttribute("crossOrigin", "Anonymous");
    image.src = val.data.data.info[0].avatar;
    image.onload = function() {
    // 这里的base就是转化后的图片(注意this指向)
      var base64 = this.getBase64Image(image);
    };

2、将字符串转化成base64格式

	// 定义方法
	encode(str) {
      // 对字符串进行编码
      var encode = encodeURI(str);
      // 对编码的字符串转化base64
      var base64 = btoa(encode);
      return base64;
    }
    console.log(this.encode('这是一段字符串'))

在这里插入图片描述

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值