.drawImage 函数为画布抛出“TypeError: Image or Canvas expected”

Question

我正在尝试在我的不和谐机器人中添加等级卡，为此我尝试使用画布，但是当我使用画布时，一切正常，直到我点击该.drawImage方法。它给我一个错误，说“类型错误：预期图像或画布”。尽管我已经在canvas全局范围内进行了要求，并且与画布有关的所有其他内容也都可以正常工作。

我试过require('canvas')在函数内部，但这也不能解决问题。

const canvas = Canvas.createCanvas(934, 282);
const ctx = canvas.getContext('2d');
const background = Canvas.loadImage('./images/Rank_Card.jpg');

ctx.drawImage(background, 0, 0, canvas.width, canvas.height);  
const attachment = new Discord.Attachment(canvas.toBuffer(), 'welcome-image.png');
msg.channel.send(`Testing...`, attachment);

当它发送消息时，它应该附上图像，但现在它只是给我以下错误。

错误：

C:\Users\Desktop\Discord\iBot\ibot.js:25
    ctx.drawImage(background, 0, 0, canvas.width, canvas.height);
        ^

TypeError: Image or Canvas expected

Answer 1

node-canvas'loadImage()方法返回一个Promise解析为<Image>.

你不能直接传递这个 Promise，你必须等待它：

const canvas = Canvas.createCanvas(934, 282);
const ctx = canvas.getContext('2d');
// we need to await the Promise gets resolved since loading of Image is async
const background = await Canvas.loadImage('./images/Rank_Card.jpg');

ctx.drawImage(background, 0, 0, canvas.width, canvas.height);  
const attachment = new Discord.Attachment(canvas.toBuffer(), 'welcome-image.png');
msg.channel.send(`Testing...`, attachment);