Node.js實現(xiàn)文本與pdf相互轉(zhuǎn)換的代碼詳解
pdf 轉(zhuǎn)文本
主要使用 pdf-parse 這個庫,直接識別提取我們 pdf 文件中的文字。
const express = require("express"); const fs = require("fs"); const PDFParser = require("pdf-parse"); const cors = require("cors"); const pdfFilePath = "./xxx_實習生.pdf"; const app = express(); // 解決跨域問題 app.use(cors()); app.use(express.static(__dirname)); app.use(express.json()); app.post("/form2pdf", (req, res) => { console.log(req.body); const str = ""; // 1. 讀取pdf文件 fs.readFile(pdfFilePath, (err, pdfBuffer) => { if (err) { console.log(err); return; } PDFParser(pdfBuffer).then((pdfData) => { const pages = pdfData.text.split("\n\n"); console.log(pages); let str; for (let i = 1; i < pages.length; i++) str = str + pages[i]; console.log(str); }); }); }); app.listen(3000, () => { console.log("Server is running on port 3000"); });
文本轉(zhuǎn) pdf
主要使用 pdfkit 這個庫將文本轉(zhuǎn)為pdf文件。
const express = require("express"); const fs = require("fs"); const cors = require("cors"); const PDFDocument = require("pdfkit"); const app = express(); // 解決跨域問題 app.use(cors()); app.use(express.static(__dirname)); app.use(express.json()); app.post("/form2pdf", (req, res) => { console.log(req.body); const str = ""; // 使用 pdfkit 生成pdf // 創(chuàng)建 PDF 文檔 const doc = new PDFDocument({ margin: 50, // 控制上下左右留白 }); // 輸出到文件 // 如果有同名的 直接覆蓋 doc.pipe(fs.createWriteStream("output.pdf")); // ========== Header ========== function addHeader(doc) { doc.fontSize(20).text(req.body.name, { align: "center" }).moveDown(); doc .moveTo(50, doc.y) // 從左邊開始畫橫線 .lineTo(550, doc.y) // 到右邊 .stroke(); doc.moveDown(); } // ========== Footer ========== function addFooter(doc) { const range = doc.bufferedPageRange(); // 所有頁 for (let i = range.start; i < range.start + range.count; i++) { doc.switchToPage(i); doc .fontSize(10) .fillColor("gray") .text(`第 ${i + 1} 頁`, 0, doc.page.height - 50, { align: "center", }); } } // ========== Body ========== function addBody(doc) { doc.fontSize(12); doc.text(req.body.name + " " + req.body.sex + " " + req.body.age, { align: "left", lineGap: 4, }); } // 添加內(nèi)容 addHeader(doc); addBody(doc); // 結(jié)束前添加 footer(多頁也有效) doc.end(); doc.on("end", () => { addFooter(doc); }); // 把后端的pdf地址返回給前端 res.json({ code: 200, data: "http://localhost:3000/output.pdf", }); res.send("PDF generated successfully!"); }); app.listen(3000, () => { console.log("Server is running on port 3000"); });
瀏覽器緩存引發(fā)的小問題
之前自己寫 demo,遇到一個小問題,可能剛剛?cè)腴T的小白一時找不到原因,特此記錄下:
- 后端生成pdf文件,但是名稱都相同(而且由于前端通過 iframe 渲染 pdf 的url 地址,url 地址也相同)
- 盡管內(nèi)容不同,但是瀏覽器發(fā)現(xiàn)相同的名稱pdf(靜態(tài)文件),會繼續(xù)使用緩存,導致后端pdf雖然重新覆蓋生成,但是前端瀏覽器中的 iframe 渲染的 pdf 還是舊的(緩存中的)。
解決方法是:
<iframe :src="url" width="100%" height="1200px"></iframe> const onSubmit = () => { axios.post("http://localhost:3000/form2pdf", form).then((res) => { url.value = res.data.data + "?t=" + Date.now(); console.log(url); }); };
添加一個時間戳來阻止瀏覽器繼續(xù)使用緩存,以保證每次重新請求都可以渲染最新的pdf 文件數(shù)據(jù)。
- 瀏覽器為什么會緩存 PDF?
靜態(tài)資源(如 PDF、圖片、JS、CSS)默認會被瀏覽器緩存。
這是因為 Express 的 express.static()
中間件會自動為靜態(tài)資源設置緩存相關的 HTTP 頭(如 Cache-Control
),讓瀏覽器下次訪問同樣的 URL 時直接用本地緩存,加快加載速度、減少服務器壓力。
只要 URL 一樣,且沒有特殊的禁止緩存設置,瀏覽器就會優(yōu)先用緩存。
如果在 /form2pdf
路由里加了:
res.setHeader("Cache-Control", 'no-store');
但這個 header 只作用于 /form2pdf
這個接口的響應,對 output.pdf
這個靜態(tài)文件的響應沒有影響。output.pdf
的響應是由 express.static(__dirname)
處理的,和接口響應頭無關。
- 為什么加參數(shù)能解決?
當你訪問 output.pdf?t=xxx
時,瀏覽器認為這是一個全新的資源(即使實際文件一樣),所以會重新請求服務器,不會用緩存。
- 如何讓靜態(tài) PDF 不被緩存?
可以讓 Express 靜態(tài)資源響應時加上禁止緩存的 header:
app.use(express.static(__dirname, { setHeaders: (res, path) => { if (path.endsWith('.pdf')) { res.setHeader('Cache-Control', 'no-store'); } } }));
這樣瀏覽器每次都會重新請求 PDF 文件。
到此這篇關于Node.js實現(xiàn)文本與pdf相互轉(zhuǎn)換的代碼詳解的文章就介紹到這了,更多相關Node.js文本與pdf互轉(zhuǎn)內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家!
相關文章
Node.js入門教程:在windows和Linux上安裝配置Node.js圖文教程
這篇文章主要介紹了Node.js入門教程:在windows和Linux上安裝配置Node.js的方法,本文圖文并茂,步驟明細,是學習安裝node.js的絕佳教程,需要的朋友可以參考下2014-08-08node連接MySQL數(shù)據(jù)庫的3種方式總結(jié)
現(xiàn)在前端基本上都會用一些NodeJs,想必也想自己寫一些API或者個人博客的后臺系統(tǒng),這些就離不開連接數(shù)據(jù)庫的問題,下面這篇文章主要給大家介紹了關于node連接MySQL數(shù)據(jù)庫的3種方式,需要的朋友可以參考下2022-08-08nodejs創(chuàng)建簡易web服務器與文件讀寫的實例
下面小編就為大家?guī)硪黄猲ode js系列課程-創(chuàng)建簡易web服務器與文件讀寫的實例。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2017-09-09node.js中fs文件系統(tǒng)模塊的使用方法實例詳解
這篇文章主要介紹了node.js中fs文件系統(tǒng)模塊的使用方法,結(jié)合實例形式詳細分析了node.js fs文件系統(tǒng)模塊各種常見方法的基本使用技巧與相關操作注意事項,需要的朋友可以參考下2020-02-02nodejs環(huán)境使用Typeorm連接查詢Oracle數(shù)據(jù)
這篇文章主要介紹了nodejs環(huán)境使用Typeorm連接查詢Oracle數(shù)據(jù),本文通過實例代碼給大家介紹的非常詳細,具有一定的參考借鑒價值,需要的朋友可以參考下2019-12-12