代码之家  ›  专栏  ›  技术社区  ›  Hend El-Sahli

image base64字符串到uint8clampedarray

  •  1
  • Hend El-Sahli  · 技术社区  · 6 年前

    我有base64格式的imagedata从返回 Expo ImagePicker component ,我想将它转换为uint8clampedarray格式的rgba像素值[r0,g0,b0,a0,r1,g1,b1,a1,…],因为它是唯一被接受的输入 jsQR library

    我试过了,但没用:

    const dataURItoBlob = byteString  => {
    
      // write the bytes of the string to a typed array
      var ia = new Uint8ClampedArray(byteString.length);
      for (var i = 0; i < byteString.length; i++) {
        ia[i] = byteString.charCodeAt(i);
      }
    
      return ia;
    };
    

    任何帮助都将不胜感激

    2 回复  |  直到 6 年前
        1
  •  1
  •   Domenik Reitzner    6 年前

    React Native的新答案:

    这个包裹应该起作用。如果可行,请告诉我。

    https://www.npmjs.com/package/get-image-data

    旧的浏览器电源:

    首先将base64 img放在画布中,如下所述:

    Base64 PNG data to HTML5 canvas

    然后应用 ImageData 对你 canvas ( https://developer.mozilla.org/en-US/docs/Web/API/ImageData )

    这将给您期望的结果。

        2
  •  0
  •   Hend El-Sahli    6 年前

    我发现的解决方案如下:

    它需要使用 typedarray , Buffer , jpeg-js

    var Uint8ClampedArray = require('typedarray').Uint8ClampedArray;
    const Buffer = require('buffer').Buffer;
    global.Buffer = Buffer; // very important
    const jpeg = require('jpeg-js');
    
    
    const jpegData = Buffer.from(base64, 'base64');
    var rawImageData = jpeg.decode(jpegData);
    
    var clampedArray = new Uint8ClampedArray(rawImageData.data.length);
    // manually fill Uint8ClampedArray, cause Uint8ClampedArray.from function is not available in react-native
    var i;
    for (i = 0; i < rawImageData.data.length; i++) {
      clampedArray[i] = rawImageData.data[i];
    }