最近項目里需要做一個在瀏覽器直接預覽pdf的功能,有些瀏覽器可以直接預覽pdf文件,但是有些不能(不要躲,說的就是你IE)查資料普遍推薦pdf.js,兼容能到ie9,很不錯了。
1. 從pdf.js官網http://mozilla.github.io/pdf.js/下載文件解壓
2.剛開始與同事商量說在點擊打開pdf的頁面上展示pdf文件,自己在上面添加一個關閉按鈕回到打開pdf界面,做的過程中發現一些莫名其妙的問題,第一遍點擊pdf文件預覽是沒有問題,在關閉后在點擊打開pdf文件時左邊的目錄樹點擊無效。改起來很困難,放棄這個方案(浪費大量時間),采用使用pdf.js最普遍的在新界面打開pdf文件。
3.運行viewer.html需要在服務器環境上運行才有效。(我用的phpStudy創建的環境)
4.實際項目中文件的位置可能與demo中的文件位置有出入,下面理出來可能需要改的文件地址,具體地址怎么改要看你文件的位置
在viewer.html頁面
在viewer.css文件里,里面的背景圖片地址要修改
在viewer.js文件里
5.打開pdf文件
在viewer.js中檢索DEFAULT_URL 得到這個
后面就是打開的pdf文件,這樣只能打開這個pdf文件,無法動態打開pdf文件
在viewer.js里,先把DEFAULT_URL后面的pdf文件去掉,
當你點擊某個pdf文件時,獲取他的文件地址,再打開這個這種格式的地址就可以打開對應的pdf文件,Viewer.html的地址+?file=+pdf文件地址 注意pdf文件的相對地址
例子:http://localhost:5697/viewer.html?file=/abc.pdf
6. 后來移到自己vs的c#后台環境中時出現問題,語言系統和pdf里中文無法顯示,那兩個文件夾里的文件都無法加載
直接訪問404鏈接都出現
查大量資料和他人提問說是.properties文件類型和.bcmap文件類型服務中沒有mime類型,需要添加對應mime類型,網上的很多資料都是在電腦里的iis里添加mime類型,半天都找不到iis,還需要安裝IIS,太麻煩了,而且你只能改自己電腦,其他電腦無法修改,簡直浪費生命,還有一個方案是在后台服務Web.config里添加mime類型,找到后台的Web.config,在里面添加
<system.webServer>
<staticContent>
<mimeMap fileExtension=".properties" mimeType="application/octet-stream" />
<mimeMap fileExtension=".bcmap" mimeType="application/octet-stream" />
</staticContent>
</system.webServer>
不知道properties、bcmap的文件類型就在mimeType填application/octet-stream
這樣語言和中文都顯示沒有問題了。累並快樂。