获取二进制图像数据并将其转换为 Uint8ClampedArray

如何解决获取二进制图像数据并将其转换为 Uint8ClampedArray

我正在开发一个 LINE 机器人，用于接收数据和图片以保存在数据库中，然后在网站中使用。

我的机器人主要收到的图片是带有二维码的优惠券。所以，这就是我从 LINE 以二进制图像数据形式接收图片时得到的结果。

结果：

这是我从行的消息中检索我的图片并检测消息类型时的代码。来自 api/line.js

import axios from 'axios';
const request = require('request')
require('dotenv').config()

let count = 0

const cal_state = []

let calState = false

const line = require('@line/bot-sdk');

export default function test(req,res) {


    // handle LINE BOT webhook verification
    // The verification message does not contain any event,so length is zero.
    if (req.body.events.length === 0) {
        res.status(200).json({})
        // console.log("hello")
        reply("Hello")   // can reply anything
        return
    }

    let event = req.body.events[0];

    let reply_token = event.replyToken


    let id = event.source.userId


    if (event.message.type !== 'text') {

        let arr = []

        const client = new line.Client({
            channelAccesstoken: process.env.CHANNEL_ACCESS_TOKEN
        });
    
        client.getMessageContent(event.message.id)
            .then((stream) => {
                stream.on('data',(chunk,p) => {
                    arr.push(chunk)
                    console.log(chunk)
                });
                stream.on('error',(err) => {
                    console.log("Error",err)
                });
            });

        reply(reply_token,event.message.type)
        console.log("arr: ",arr)


    } else {
        postToDialogflow(req)
    }
}

function reply(reply_token,msg) {


    let headers = {
        'Content-Type': 'application/json','Authorization': 'Bearer {' + process.env.CHANNEL_ACCESS_TOKEN + '}'
    }

    // console.log('msg:',msg)
    let body = JSON.stringify({
        replyToken: reply_token,messages: [{
            type: 'text',text: msg
        }]
    })
    console.log("reply =============> ",body)

    request.post({
        url: 'https://api.line.me/v2/bot/message/reply',headers: headers,body: body
    },(err,res,body) => {
        // console.log('status = ' + res.statusCode);

        // console.log("body ====> ",res.body)
    });
}

我通常可以console.log(chuck)。但是，当我尝试将它存储在某个变量中时。例如，在数组中。它说 chuck 没有定义。

错误：

此外，有没有办法将二进制图像数据转换为 Uint8ClampedArray 对象。因为我用来从图片中解码二维码的 npm 库就是这个库。 https://www.npmjs.com/package/jsqr

并且它需要将 imageData 作为 Uint8ClampedArray 对象传递。

这是我从图片中处理二维码时的代码（截至目前它从文件夹中的静态图像中获取 image.src）。下面的代码在单独的文件中。我打算把这段代码放到 api/line.js

二维码（来自 index.js）：

import Head from 'next/head'
import styles from '../styles/Home.module.css'
import jsQR from 'jsqr'
import { useEffect,useState } from 'react'

export default function Home() {

  const [qrData,setQRdata] = useState('')

  useEffect(() => {
    
    const canvas = document.getElementById("canvas");
    const ctx = canvas.getContext('2d');

    const image = new Image;
    let imageDataT = new Uint8ClampedArray()
    image.src = './img/Coupon_with_Hash.png'
    image.onload = () => {
      ctx.drawImage(image,canvas.width,canvas.height);
      imageDataT = ctx.getimageData(0,image.width,image.height);
      console.log(imageDataT);
      const code = jsQR(imageDataT.data,image.height,'dontInvert')
      if (code) {
        setQRdata(code.data)
        console.log("Found QR code",code);
        console.log("Result",code.data);
      } else {
        console.log("Do not detect code.")
      }
    }
  })

  return (
    <div className={styles.container}>
      <Head>
        <title>Create Next App</title>
        <link rel="icon" href="/favicon.ico" />
      </Head>

      <main className={styles.main}>
        <h1 className={styles.title}>
          Detect QR-Code from Picture
        </h1>

        <p className={styles.description}>
          Static Image show from folder 'public'.
        </p>

        <canvas id="canvas"></canvas>

        <p>Result: {qrData}</p>
      </main>

      <footer className={styles.footer}>
        
      </footer>
    </div>
  )
}

如何存储行的结果并将二进制图像数据转换为 Uint8ClampedArray 对象？

获取二进制图像数据并将其转换为 Uint8ClampedArray

如何解决获取二进制图像数据并将其转换为 Uint8ClampedArray

相关推荐