TypeError: Image or Canvas expected

Question

这是我在获取图像但不工作的路由中使用带有请求参数 text 的 express 的函数

const { Canvas } = require('canvas-constructor')
const canvas = require('canvas')

function getStatusBanner(req, res) {
    const img = canvas.loadImage('./images/banner.jpg')
    
    let image = new Canvas(339, 94)
    .printImage(img, 0, 0, 339, 94)
    .setTextFont('12px Impact')
    .printText(req.params.text, 130, 150)
    .toBuffer();

    res.set({'Content-Type': 'image/jpg'})
    res.send(image)
}

module.exports = { getStatusBanner }

似乎根本不起作用

TypeError: Image or Canvas expected
    at s.printImage (E:\Coding\OTHER\megumin\node_modules\canvas-constructor\dist\index.js:1:3866)
    at getStatusBanner (E:\Coding\OTHER\megumin\functions\getBanner.js:8:6)
    at Layer.handle [as handle_request] (E:\Coding\OTHER\megumin\node_modules\express\lib\router\layer.js:95:5)
    at next (E:\Coding\OTHER\megumin\node_modules\express\lib\router\route.js:137:13)
    at Route.dispatch (E:\Coding\OTHER\megumin\node_modules\express\lib\router\route.js:112:3)
    at Layer.handle [as handle_request] (E:\Coding\OTHER\megumin\node_modules\express\lib\router\layer.js:95:5)
    at E:\Coding\OTHER\megumin\node_modules\express\lib\router\index.js:281:22
    at Function.process_params (E:\Coding\OTHER\megumin\node_modules\express\lib\router\index.js:335:12)
    at next (E:\Coding\OTHER\megumin\node_modules\express\lib\router\index.js:275:10)
    at E:\Coding\OTHER\megumin\index.js:29:5

Answer 1

我已经测试了您的代码并进行了一些更改以使其正常工作。

loadImage 方法异步工作。您需要更改代码才能以这种方式工作。

遵循代码。剩下的就是把文本参数，但我认为你可以适应你的代码。

const { Canvas,resolveImage } = require('canvas-constructor')
const canvas = require('canvas')
const express = require('express')
const app = express()
const port = 3000


app.get('/', async (req, res) => {
    const img = await createCanvas();
    res.set({'Content-Type': 'image/jpg'})
    res.send(img)
})

app.listen(port, () => {
  console.log(`Example app listening at http://localhost:${port}`)
})


async function createCanvas() {
    const img = await canvas.loadImage('./images/banner.jpg');
    return new Canvas(339, 94)
        .printImage(img, 0, 0, 339, 94)
        .toBufferAsync();
}

TypeError: Image or Canvas expected

TypeError: Image or Canvas expected

canvas

node.js

express