从 Firebase 存储中获取图像并放入 PDF
Getting Image from Firebase Storage and placing into PDF
所以我是 PDF 工具包的新手,对 Javascript 有基本的了解,但我似乎一辈子都想不出如何将 Firebase 存储中的图像放入 PDF 或者如果有办法使用 GCF 存储该图像并将其放入 PDF 中。我正在使用 Google Cloud Functions 和 Node.js 生成 PDF 以下是我目前所拥有的:
exports.pdf = functions.https.onRequest((request,response)=>{
//Create a document
const PDFDocument = require('pdfkit');
const doc = new PDFDocument();
const storageBucket = admin.storage().bucket();
const logo = g
generateHeader(doc);
// Pipe its output somewhere, like to a file or HTTP response
// See below for browser usage
// Embed a font, set the font size, and render some text
doc.font('Courier')
.fontSize(15)
.text('Some text with an embedded font!', 100, 100);
// Add an image, constrain it to a given size, and center it vertically and horizontally
// doc.image('https://firebasestorage.googleapis.com/v0/b/redog-bf9c8.appspot.com/o/pdfresource%2Fsplash.png?alt=media&token=25028ea2-5085-4782-9038-88b694b69f50', {
// fit: [250, 300],
// align: 'center',
// valign: 'center'
// });
// Add another page
doc.addPage()
.fontSize(25)
.text('Here is some vector graphics...', 100, 100);
// Draw a triangle
doc.save()
.moveTo(100, 150)
.lineTo(100, 250)
.lineTo(200, 250)
.fill("#FF3300");
// Apply some transforms and render an SVG path with the 'even-odd' fill rule
doc.scale(0.6)
.translate(470, -380)
.path('M 250,75 L 323,301 131,161 369,161 177,301 z')
.fill('red', 'even-odd')
.restore();
// Add some text with annotations
doc.addPage()
.fillColor("blue")
.text('Here is a link!', 100, 100)
.underline(100, 100, 160, 27, {color: "#0000FF"})
.link(100, 100, 160, 27, 'http://google.com/');
// Finalize PDF file
const myPdfFile = admin.storage().bucket().file('/test/Arbeitsvertrag.pdf');
const stream = doc.pipe(myPdfFile.createWriteStream());
doc.end();
});
function generateHeader(doc) {
doc
.image("storage/pdfresource/splash.png", 50, 45, { width: 50 })
.fillColor("#444444")
.fontSize(20)
.text("ACME Inc.", 110, 57)
.fontSize(10)
.text("123 Main Street", 200, 65, { align: "right" })
.text("New York, NY, 10025", 200, 80, { align: "right" })
.moveDown();
}
我遇到的问题是在 GenerateHeader 函数中...它一直找不到文件...有人知道我如何将它指向正确的方向吗?
我并没有完全回答你的问题,但如果你想在你的 PDF 中嵌入 static 图片,这里有一个解决方案,例如公司标志.
您可以将图像存储在 functions
文件夹下的文件夹中,并在您的 Cloud Function 代码中调用它。
例如,在您的IDE中,在functions
文件夹下创建一个文件夹images
,在该文件夹下添加图像splash.png
,并在您的代码中调用图片如下:
doc
.image('./images/splash.png', 50, 45, { width: 50 })
.fillColor('#444444')
....
然后 re-deploy Cloud Function,它应该可以解决问题。
这里的解决方案是将下载 url 放到一个单独的函数中:
function toBase64(url) {
return new Promise(async (resolve, reject)=>{
var https = require('https');
var req = await https.get(url, (res) => {
res.setEncoding('base64');
let body = "data:" + res.headers["content-type"] + ";base64,";
console.log("BODY", body)
res.on('data', (d) => {
body += d;
});
res.on('end', () => {
console.log("END", body)
resolve(body);
});
});
req.on('error', err => {
console.error('error!',err);
reject(err);
});
});
}
然后像这样将其放入您的文档中:
return Promise.all([toBase64(url)]).then(([base64])=>{
doc.image(base64,{width:50});
})
所以我是 PDF 工具包的新手,对 Javascript 有基本的了解,但我似乎一辈子都想不出如何将 Firebase 存储中的图像放入 PDF 或者如果有办法使用 GCF 存储该图像并将其放入 PDF 中。我正在使用 Google Cloud Functions 和 Node.js 生成 PDF 以下是我目前所拥有的:
exports.pdf = functions.https.onRequest((request,response)=>{
//Create a document
const PDFDocument = require('pdfkit');
const doc = new PDFDocument();
const storageBucket = admin.storage().bucket();
const logo = g
generateHeader(doc);
// Pipe its output somewhere, like to a file or HTTP response
// See below for browser usage
// Embed a font, set the font size, and render some text
doc.font('Courier')
.fontSize(15)
.text('Some text with an embedded font!', 100, 100);
// Add an image, constrain it to a given size, and center it vertically and horizontally
// doc.image('https://firebasestorage.googleapis.com/v0/b/redog-bf9c8.appspot.com/o/pdfresource%2Fsplash.png?alt=media&token=25028ea2-5085-4782-9038-88b694b69f50', {
// fit: [250, 300],
// align: 'center',
// valign: 'center'
// });
// Add another page
doc.addPage()
.fontSize(25)
.text('Here is some vector graphics...', 100, 100);
// Draw a triangle
doc.save()
.moveTo(100, 150)
.lineTo(100, 250)
.lineTo(200, 250)
.fill("#FF3300");
// Apply some transforms and render an SVG path with the 'even-odd' fill rule
doc.scale(0.6)
.translate(470, -380)
.path('M 250,75 L 323,301 131,161 369,161 177,301 z')
.fill('red', 'even-odd')
.restore();
// Add some text with annotations
doc.addPage()
.fillColor("blue")
.text('Here is a link!', 100, 100)
.underline(100, 100, 160, 27, {color: "#0000FF"})
.link(100, 100, 160, 27, 'http://google.com/');
// Finalize PDF file
const myPdfFile = admin.storage().bucket().file('/test/Arbeitsvertrag.pdf');
const stream = doc.pipe(myPdfFile.createWriteStream());
doc.end();
});
function generateHeader(doc) {
doc
.image("storage/pdfresource/splash.png", 50, 45, { width: 50 })
.fillColor("#444444")
.fontSize(20)
.text("ACME Inc.", 110, 57)
.fontSize(10)
.text("123 Main Street", 200, 65, { align: "right" })
.text("New York, NY, 10025", 200, 80, { align: "right" })
.moveDown();
}
我遇到的问题是在 GenerateHeader 函数中...它一直找不到文件...有人知道我如何将它指向正确的方向吗?
我并没有完全回答你的问题,但如果你想在你的 PDF 中嵌入 static 图片,这里有一个解决方案,例如公司标志.
您可以将图像存储在 functions
文件夹下的文件夹中,并在您的 Cloud Function 代码中调用它。
例如,在您的IDE中,在functions
文件夹下创建一个文件夹images
,在该文件夹下添加图像splash.png
,并在您的代码中调用图片如下:
doc
.image('./images/splash.png', 50, 45, { width: 50 })
.fillColor('#444444')
....
然后 re-deploy Cloud Function,它应该可以解决问题。
这里的解决方案是将下载 url 放到一个单独的函数中:
function toBase64(url) {
return new Promise(async (resolve, reject)=>{
var https = require('https');
var req = await https.get(url, (res) => {
res.setEncoding('base64');
let body = "data:" + res.headers["content-type"] + ";base64,";
console.log("BODY", body)
res.on('data', (d) => {
body += d;
});
res.on('end', () => {
console.log("END", body)
resolve(body);
});
});
req.on('error', err => {
console.error('error!',err);
reject(err);
});
});
}
然后像这样将其放入您的文档中:
return Promise.all([toBase64(url)]).then(([base64])=>{
doc.image(base64,{width:50});
})