完美解決jspdf各種中文亂碼問題

ywbjja發表於2018-12-20
JS

我就像一個啞巴一樣

今天分享一下完美解決jsPDF生成pdf出現亂碼的問題，包括文字，表格表頭已經表格內部出現亂碼的問題~
首先老規矩把程式碼clone下來

git clone https://github.com/MrRio/jsPDF.git
複製程式碼

然後開啟檔案根目錄會看到一個fontconverter的資料夾

完美解決jspdf各種中文亂碼問題
開啟裡面的html檔案，然後把選擇你的本地檔案，填上name最好要填中文！然後會生成一個js檔案，然後你需要把這個js檔案複製到你前端檔案的static靜態資源目錄下，並且在頁面上引用。

完美解決jspdf各種中文亂碼問題
TIP:最好按照我下圖的順序引入，不然又可能會出現問題~

完美解決jspdf各種中文亂碼問題
然後你只需要

doc.setFont('msyh')
複製程式碼

其實這個時候pdf內部的文字和表格內的中文都應該會正常顯示了，但是表頭還是出現了亂碼，

完美解決jspdf各種中文亂碼問題
因此我就去翻了下jspdf-autotable的js原始碼，程式碼如下

完美解決jspdf各種中文亂碼問題
其實重點就是圖中標紅的地方，當你選擇table的主題為grid的時候，它預設header那裡的fontStyle是bold，如果你把這裡改成normal然後再重新生成pdf就會發現中文也正常了~

完美解決jspdf各種中文亂碼問題
問題就這樣迎刃而解了~心情大好有木有！

歡迎來關注我的公眾號~

完美解決jspdf各種中文亂碼問題

相關文章