Chat PDF AI上线：nextjs中pdf文件的解析

Auteur:neo yang Tijd:2024/11/26 Lezen: 8334

---

最近几天，又上线了一个AIGC工具站：Chat PDF AI

基于PDF的问答、摘要等。

这次搞这个，比较麻烦的事PDF的解析，因为这和部署有关。

方案一：使用pdfjs-dist

import * aspdfjsLibfrom 'pdfjs-dist'pdfjsLib.GlobalWorkerOptions.workerSrc = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjsLib.version}/pdf.worker.min.mjs`
/*注意，这里要mjs,因为js是找不到的。*/

  constfetchPdfContent =async (pdfSrc:string) => {
    try {
      // Use the proxy API to fetch the PDF
      constproxyUrl =`/api/xxx?url=${encodeURIComponent(pdfSrc)}`
      constpdf =awaitpdfjsLib.getDocument(proxyUrl).promise
      letfullText =''
      for (leti =1; i <= pdf.numPages; i++) {constpage =awaitpdf.getPage(i)consttextContent =awaitpage.getTextContent()
        constpageText = textContent.items.map((item: any) =>item.str).join(' ')
        fullText += pageText +'\n'
      }
      console.log(fullText)setPdfContent(fullText)
}

这样是可以成功解析PDF的，但是部署到cloud flare就有问题了，因为cloudflare是不支持一些node内置的模块的，因为它是部署在边缘。所以部署时，会报错：大致的意识是：不能使用fs, http/https, url这几个node内置的东西。

方案二：unpdf

这是cloud flare推荐的方案。确实方便一些。关键代码：

  import{ getDocumentProxy, extractText}from "unpdf";

constfetchPdfContent =async (pdfSrc:string) => {
    try {
      // 使用代理API获取PDF内容
       constproxyUrl =`/api/xxx?url=${encodeURIComponent(pdfSrc)}`
      
      // 使用fetch获取PDF数据
      constresponse =await fetch(proxyUrl);constarrayBuffer =awaitresponse.arrayBuffer();
      constpdf =await getDocumentProxy(new Uint8Array(arrayBuffer));constdata =await extractText(pdf, {mergePages: true}); 
      setPdfContent(data.text); 
}

解析没有问题，但部署到cloud flare上依旧有问题。因为使用了getDocumentProxy, extractText这两个unpdf的模块，导致有个worker的大小超过了1M，在cloud flare上，worker超过1M就要付费。

这个unpdf，真不愧是cloud flare推荐的啊。

总结

最后，我把这个项目部署在了vercel上。