Javascript 把手+；木偶演员使用base64显示本地png图像

我有一个项目，我正在建立一个带有把手的html，并使用Puppeter将其转换为pdf。我遇到了一个问题，即在呈现pdf后，我的base64编码图像不会显示图像。对于额外的上下文，我们将在生成pdf后将其存储在数据库中，并且我们的图像位于本地资产目录中。我可以将图像加载到codesandbox中，但不包括木偶演员，所以我认为这就是问题所在

//获取车把模板并编译它
const compile=async（templateName，data）=>{
const filePath=path.join（uu dirname，“templates”，“${templateName}.hbs`）；
如果（！filePath）{
抛出新错误（`generatePDF`中找不到${templateName}.hbs`）；
}
const html=wait fs.readFile（文件路径，“utf-8”）；
返回hbs.compile（html）（数据）；
};
//使用Puppeter接收已编译的hbs文档并创建pdf
const generatePDF=async（文件名、数据）=>{
const preparedData=prepareDataForPDF（数据）；
const browser=wait puppeter.launch({
args:[“--no sandbox”]，
无头：是的，
});
const page=wait browser.newPage（）；
const content=等待编译（文件名，preparedData）；
wait page.goto（`data:text/html；charset=UTF-8，${content}`{
等待至：“networkidle0”，
});
等待页面。设置内容（content）；
等待页面。仿真媒体（“屏幕”）；
等待页面。等待（100）；
const pdf=wait page.pdf({
格式：“A4”，
背景：是的，
});
browser.close（）；
返回pdf；
};
//将我的图像转换为base64的帮助程序
注册表帮助器（“getIntro”，异步（上下文，idx）=>{
让bitmap=wait fs.readFile(
join（uu dirname，“assets”、`${context}\u intro{idx}.png`），
);
const buff=等待缓冲区（位图）.toString（“base64”）；
让imgSrcString=`data:image/png；base64，${buff}`；
console.log（imgSrcString）；
返回imgSrcString；
});
我不是把这当作一个答案，只是把它当作我用来解决这个问题的方法。我有一个react FE，我的应用程序是在一个mono repo中，它被联合部署到Heroku。所以我决定将这些图像放在我的client/public目录中，然后在我的handlebar代码中，我引用了它的url和文件名。这让我能够以一种更易于管理的方式托管自己的图像，而不必强迫客户使用另一种工具，如s3 Bucket。这个解决方案并不理想，但它目前仍然有效。
我不把它当作一个答案，而只是把它当作我用来解决这个问题的方法。我有一个react FE，我的应用程序是在一个mono repo中，它被联合部署到Heroku。所以我决定将这些图像放在我的client/public目录中，然后在我的handlebar代码中，我引用了它的url和文件名。这让我能够以一种更易于管理的方式托管自己的图像，而不必强迫客户使用另一种工具，如s3 Bucket。此解决方案并不理想，但目前仍有效