You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

@napi-rs/canvas无法正常渲染文本问题求助

@napi-rs/canvas 无法渲染文本问题求助

我已花费约3小时排查问题,恳请各位提供帮助。这是一个使用@napi-rs/canvas的discord.js项目,目前@napi-rs/canvas完全无法渲染文本——生成的图片仅显示背景图和用户头像,用户名及 discriminator 文本完全不显示。代码通过railway.app在线运行。

代码示例

client.on("guildMemberAdd", async function(member){
  if (member.guild.id != guildId) return
    const canvas = Canvas.createCanvas(800, 500);
    const context = canvas.getContext('2d');
    const pfp = await Canvas.loadImage(member.displayAvatarURL({format: "png"}))
    const bg = await Canvas.loadImage('./joinbg.png')
    const uname = member.user.username
    const dcrim = member.user.discriminator
    console.log(uname+"#"+dcrim+" has joined! sending join img + verification!")
    
    context.drawImage(bg, 0, 0, canvas.width, canvas.height)
    context.strokeStyle = "#ffffff"
    //context.strokeRect(0, 0, canvas.width, canvas.height);
    context.fillStyle = 'rgba(255,255,255,1)'
    context.font = '50px sans-serif'
    context.fillText(""+uname, 200, 100)
    //context.fillText(text, 0, 0)
    context.fillStyle = 'rgba(155, 155, 155, 1)'
    context.font = '30px sans-serif'
    context.fillText("#" + dcrim, 200, 140)
    //context.fillText(text2, 0, 0)
    // Pick up the pen
    context.beginPath();

    // Start the arc to form a circle
    context.arc(106.5, 105.5, 92.5, 92.5, Math.PI * 1, true);

    // Put the pen down
    context.closePath();

    // Clip off the region you drew on
    context.clip();
    context.drawImage(pfp, 14, 13, 185, 185)

    const a = new ActionRowBuilder()
    .addComponents(
        new ButtonBuilder()
        .setCustomId('tos')
        .setLabel('View ToS')
        .setStyle(ButtonStyle.Secondary),
    )

    const newimg = new AttachmentBuilder(await canvas.encode('png'), { name: uname+'#'+dcrim+'-joined.png' })
    client.guilds.fetch("" + process.env.guildid) .then((guild) => {
      guild.channels.fetch("" + process.env.welcomechannelid) .then((channel) => {
        channel.send({ files: [newimg] })
        member.send({
          content: "**Welcome to Plot Block [LIFESTEAL]!**

We hope you have a good time here!
Please click on the button below to begin the first step of the verification process!",
          components: [a]
        })
      })
    })
})

已尝试的解决步骤

  • 回退@napi-rs/canvas到旧版本^0.1.30,问题仍未解决
  • 此前制作的欢迎图片完全正常,仅当前新生成的图片无法渲染文本

若需要更多信息我可以提供。

内容的提问来源于stack exchange,提问作者sks60

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.29 03:13:22