微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

Pdfjs 从 Safari 上的 S3 获取 PDF 文件,但不能在 chrome 和 firefox 上工作,错误 404 未找到,缺少 PDF 异常

如何解决Pdfjs 从 Safari 上的 S3 获取 PDF 文件,但不能在 chrome 和 firefox 上工作,错误 404 未找到,缺少 PDF 异常

我们将 PDF 文件存储在 AWS S3 之上,并通过 Cloudfront 访问它。要访问 PDF 文件,我必须调用 api:/api/preview-file/30.json 但在 chrome 和 firefox 上,我收到错误:“MissingPDFException”,但在 Safari 上一切正常,这令人困惑。 我已经搜索但没有答案,期待您的帮助。谢谢!

配置:

  • 网络浏览器及其版本:Chrome 版本 89.0.4389.114(官方版本)(x86_64)、Firefox 87.0(64 位)
  • 操作系统及其版本:Mac OS High Sierra 10.13.6
  • PDF.js 版本:2.6.347

出了什么问题? (添加截图)

  • 火狐:

    Screen Shot 2021-04-12 at 14 08 34

  • 铬:

    Screen Shot 2021-04-12 at 14 13 21

我的代码:PreviewFile.vue

import * as pdfjsLib from 'pdfjs-dist'
import * as pdfjsWorker from 'pdfjs-dist/build/pdf.worker.entry'

pdfjsLib.GlobalWorkerOptions.workerSrc = pdfjsWorker

export default {
    name: 'PreviewFile',mounted () {
        // const url = this.$route.query.q
        pdfjsLib.getDocument('/api/preview-file/30.json').promise.then(pdf => {
            const viewer = document.getElementById('pdf-viewer')

            for (let pageNum = 1; pageNum <= pdf.numPages; pageNum++) {
                const canvas = document.createElement('canvas')
                canvas.className = 'pdf-page-canvas'
                viewer.appendChild(canvas)
                pdf.getPage(pageNum).then(page => {
                    const viewport = page.getViewport({ scale: 2 })
                    canvas.height = viewport.height
                    canvas.width = viewport.width
                    page.render({ canvasContext: canvas.getContext('2d'),viewport: viewport })
                })
            }
        })
    }
}


Firefox 上的网络:404

Screen Shot 2021-04-12 at 14 47 35

Safari 上的网络:好的

Screen Shot 2021-04-12 at 14 45 52

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。