|

解決使用pdfmake.js的中文字亂碼和CORS錯誤訊息問題

筆者在使用pdfmake.js製作能夠前端生成pdf的工具,並佈署到Wordpress時遭遇下列問題

遭遇問題1.中文字亂碼:

生成的pdf內容之中文字顯示會有亂碼的問題,而參考了這個文章後發現pdfmake.js的字體僅支援英文,若要使用中文字需要改用其他字型,而該文章使用之字體為NotoSansTC 。

解決方法:

剛好在github上看到有好心人士已經將字型檔案轉成ttf的格式,連結整理如下:

NotoSansTC-Regular.ttf

NotoSansTC-Bold.ttf

因此筆者就利用這個將字型儲存至後台,並透過cdn的方式連結,最終成功使pdfmake.js產生的pdf顯示中文字體。

遭遇問題2.本機測試錯誤訊息:

使用本機端做測試時在console出現錯誤訊息,訊息內容如下圖:

has been blocked by cors policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.

has been blocked by cors policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.

從訊息內容中可以看出,應該是像網站請求時header少了一些資訊

解決方法:

直接部屬到wordpress即可解決,參考資料

Similar Posts