请选择 进入手机版 | 继续访问电脑版
 找回密码
 立即注册
搜索

技术分享 图片转Base64

0
回复
110
查看
[复制链接]

1

主题

1

帖子

10

积分

 楼主| 2019-9-25 17:17:51 显示全部楼层 |阅读模式
需求是这样的:调用手机摄像头拍照然后调用API,接口需要一个base64的图片String。
代码如下,防止图片过大我做了压缩


1.拍摄图片
this.$element('camera').takePhoto({
      // 通过quality参数设置照片质量
      quality: _this.photoQuality,
      success(data) {
        // 获取回调中的照片地址
        _this.pictureUrl = data.uri
        console.info('compressimg before' + data.uri)

        image.compressImage({
          uri: data.uri,
          radio: 2, // 变为原图的1/2大小
          format: 'JPEG',
          success: function (data) {
            console.info('compressimg' + data.uri)
            fileimpl.readArrayBuffer({              uri: data.uri, success: function (temp) {
                // console.log('base64===' + _arrayBufferToBase64(temp.buffer))
                var strBase64 = _arrayBufferToBase64(temp.buffer)
                _this.visible = '0'
              }, fail: function (data, code) {
                console.info('base64=== error')
                _this.visible = '0'
              }            })
          },
          fail: function (data, code) {
            console.info(`handling fail, code = ${code}`)
            _this.visible = '0'
          }
        })

      },
      fail(data, code) {
        _this.visible = '0'
        console.info('take photos failed:code' + code.code)
      },
      complete() {
        console.info('complete')
      }
    })

2.图片转Base64代码

function _arrayBufferToBase64(raw) {
  var base64 = ''
  var encodings = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/'
  var bytes = new Uint8Array(raw)
  var byteLength = bytes.byteLength;
  var byteRemainder = byteLength % 3
  var mainLength = byteLength - byteRemainder
  var a, b, c, d
  var chunk
  // Main loop deals with bytes in chunks of 3
  for (var i = 0; i < mainLength; i = i + 3) {
    // Combine the three bytes into a single integer
    chunk = (bytes[i] << 16) | (bytes[i + 1] << 8) | bytes[i + 2]
    // Use bitmasks to extract 6-bit segments from the triplet
    a = (chunk & 16515072) >> 18 // 16515072 = (2^6 - 1) << 18
    b = (chunk & 258048) >> 12 // 258048 = (2^6 - 1) << 12
    c = (chunk & 4032) >> 6 // 4032 = (2^6 - 1) << 6
    d = chunk & 63 // 63 = 2^6 - 1
    // Convert the raw binary segments to the appropriate ASCII encoding
    base64 += encodings[a] + encodings[b] + encodings[c] + encodings[d]
  }
  // Deal with the remaining bytes and padding
  if (byteRemainder == 1) {
    chunk = bytes[mainLength]
    a = (chunk & 252) >> 2 // 252 = (2^6 - 1) << 2;
    // Set the 4 least significant bits to zero
    b = (chunk & 3) << 4 // 3 = 2^2 - 1;
    base64 += encodings[a] + encodings[b] + '=='
  }
  else if (byteRemainder == 2) {
    chunk = (bytes[mainLength] << 8) | bytes[mainLength + 1]
    a = (chunk & 16128) >> 8 // 16128 = (2^6 - 1) << 8;
    b = (chunk & 1008) >> 4 // 1008 = (2^6 - 1) << 4;
    // Set the 2 least significant bits to zero
    c = (chunk & 15) << 2 // 15 = 2^4 - 1;
    base64 += encodings[a] + encodings[b] + encodings[c] + '='
  }
  // return 'data:image/jpeg;base64' + base64
  return base64
}






回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册