使用 pdf.js 跨域問題的處理方法1

• 2019 年 10 月 31 日
• 筆記

在《使用 pdf.js 在網頁中加載 pdf 文件》中詳細介紹了 pdf.js 的使用與集成網頁開發的基本方法。展示效果如下圖：

站點的目錄為 http://localhost:8033/PDFTest。此時PDF文件就部署在IIS站點的子目錄下，這種方式訪問一切正常。

var pdfFile = "http://localhost:8033/PDFTest/Pdf/項目的5個管理過程組和項目管理知識領域映射關係.pdf";

如果PDF文件位於其他站點下，則涉及到跨域訪問的問題。比如訪問位於下列IIS站點中的PDF文件

var pdfFile = "http://localhost:7030/項目的5個管理過程組和項目管理知識領域映射關係.pdf";

訪問則出現如下錯誤。提示：跨域訪問被禁止。

下面介紹方法來解決跨域訪問的問題。

1、找到目標站點

2、找到“HTTP響應標頭”，雙擊打開

右鍵–“添加”，添加以下2條：

Access-Control-Allow-Headers：Content-Type, api_key, Authorization 

Access-Control-Allow-Origin：*

    

配置完成後，如下圖

3、【停止】目標站點，【啟動】目標站點。

4、重新訪問該站點，PDF加載顯示正常

如果訪問還是出錯，請執行 iisreset 命令，清空瀏覽器緩存後再次訪問即可正常。