Node.js 从节点传递数据以响应构造PDF时使用base64编码
我正在将一些数据从节点后端流式传输到React前端,然后使用streamsaver库获取流并将其保存为PDF。在这个过程结束时,我下载了正确数量的文档。但是,页面是空白的,这表明数据没有正确编码。所以我尝试使用base64编码 我的后端代码如下所示:Node.js 从节点传递数据以响应构造PDF时使用base64编码,node.js,reactjs,base64,Node.js,Reactjs,Base64,我正在将一些数据从节点后端流式传输到React前端,然后使用streamsaver库获取流并将其保存为PDF。在这个过程结束时,我下载了正确数量的文档。但是,页面是空白的,这表明数据没有正确编码。所以我尝试使用base64编码 我的后端代码如下所示: async getNotesPDFStream(args, session, ctx) { try { const data = await this.getDataToStream(args, session, ctx);
async getNotesPDFStream(args, session, ctx) {
try {
const data = await this.getDataToStream(args, session, ctx);
fs.writeFileSync("./test.pdf", data); // This test works on the backend - creates a PDF
const encodedData = btoa(data); // encoding as a base64 string
const readable = new Readable();
readable.push(encodedData);
readable.push(null);
readable.pipe(ctx.stream);
return Response.Success("PDF now streaming!");
} catch (err) {
console.log("Error 167: ", err);
return Response.Error("Error retrieving progress notes PDF.", err);
}
}
在React前端,我会这样做:
let buffer = '';
dataStream.on('data', (data) => {
buffer += data;
});
dataStream.on('end', () => {
console.log('STREAM FINISHED');
const fileStream = streamSaver.createWriteStream('notes.pdf');
const decodedData = atob(buffer); // Decode the final buffer
console.log('decodedData: ', decodedData);
const pdfBlob = new Blob([decodedData], { type: 'application/pdf' });
const readableStream = pdfBlob.stream();
if (window.WritableStream && readableStream.pipeTo) {
return readableStream
.pipeTo(fileStream)
.then(() => console.log('Done writing'));
}
// Write (pipe) manually
const writer = fileStream.getWriter();
const reader = readableStream.getReader();
const pump = () =>
reader
.read()
.then(res =>
res.done ? writer.close() : writer.write(res.value).then(pump)
);
pump();
在尝试了这个之后,我下载了正确数量的PDF文档页面,但是页面仍然是空白的。我错过了什么?如何确保这是正确编码的
顺便说一句,我试着使用一些基本的html,并以相同的方式传递,使用相同的编码方法,它正确地重建了html。作为PDF文档的构建有什么特别需要注意的吗?最后我意识到我把它变得比必要的更复杂了。使用
writer.write()
功能,我能够想出这个简洁的工作解决方案:
dataStream.on('data', (data) => {
writer.write(data) // should be a Uint8Array
})
dataStream.on('end', () => {
console.log('STREAM FINISHED');
writer.close();
});