如何解码包含在反应JS基座64 PNG QR码

我一直在试图解码具有JSON数据这个QR码。

在在线工具及其工作示例/。它读取数据。我想编程

这里是我的代码

handleFileChange(event) {
    const {target} = event;
    const {files} = target;

    if (files && files[0]) {
      const reader = new FileReader();

      //  reader.onloadstart = () => this.setState({loading: true});

      reader.onload = async event => {
        this.setState({
          data: event.target.result,
          loading: false
        });
       // const img = document.getElementById('img');
      console.log(event.target.result);
        let result;
        try {
          var qr = new QrCode();

// set the callback that receives the decoded content as the tasks is async
          qr.callback = function(decodedDATA){
            alert(decodedDATA);
          };

    // event.target.result is
 //data:image/png;base64,iVBORw0KGgoAAAANSU...
          qr.decode(event.target.result);
        } catch (err) {
          console.log(err);
        }

        console.log(result);
      };

      reader.readAsDataURL(files[0]);
    }
  }
<input
              id="img"
              type="file"
              accept="image/*"
              onChange={this.handleFileChange}
            />

我已经使用这个库，不能读取超过某些字符，因此我得到的错误更多的数据。我也曾尝试使用斑马线库，但我使用服务器端渲染得到错误窗口是不确定的。有很多的配置需要的WebPack做，但我不知道这些的。我在寻找简单的解决这一点。任何一个可以请帮我与工作库。

发现与此库QRCode的解码器的解决方案。

在我的代码

import QrcodeDecoder from 'qrcode-decoder';

          const qr = new QrcodeDecoder();

         const result = await qr.decodeFromImage(event.target.result);

如何解码包含在反应JS基座64 PNG QR码

我一直在试图解码具有JSON数据这个QR码。

在在线工具及其工作示例/。它读取数据。我想编程

这里是我的代码

handleFileChange(event) {
    const {target} = event;
    const {files} = target;

    if (files && files[0]) {
      const reader = new FileReader();

      //  reader.onloadstart = () => this.setState({loading: true});

      reader.onload = async event => {
        this.setState({
          data: event.target.result,
          loading: false
        });
       // const img = document.getElementById('img');
      console.log(event.target.result);
        let result;
        try {
          var qr = new QrCode();

// set the callback that receives the decoded content as the tasks is async
          qr.callback = function(decodedDATA){
            alert(decodedDATA);
          };

    // event.target.result is
 //data:image/png;base64,iVBORw0KGgoAAAANSU...
          qr.decode(event.target.result);
        } catch (err) {
          console.log(err);
        }

        console.log(result);
      };

      reader.readAsDataURL(files[0]);
    }
  }
<input
              id="img"
              type="file"
              accept="image/*"
              onChange={this.handleFileChange}
            />

我已经使用这个库，不能读取超过某些字符，因此我得到的错误更多的数据。我也曾尝试使用斑马线库，但我使用服务器端渲染得到错误窗口是不确定的。有很多的配置需要的WebPack做，但我不知道这些的。我在寻找简单的解决这一点。任何一个可以请帮我与工作库。

发现与此库QRCode的解码器的解决方案。

在我的代码

import QrcodeDecoder from 'qrcode-decoder';

          const qr = new QrcodeDecoder();

         const result = await qr.decodeFromImage(event.target.result);