解決使用pdfmake.js的中文字亂碼和CORS錯誤訊息問題
筆者在使用pdfmake.js製作能夠前端生成pdf的工具,並佈署到Wordpress時遭遇下列問題
遭遇問題1.中文字亂碼:
生成的pdf內容之中文字顯示會有亂碼的問題,而參考了這個文章後發現pdfmake.js的字體僅支援英文,若要使用中文字需要改用其他字型,而該文章使用之字體為NotoSansTC 。
解決方法:
剛好在github上看到有好心人士已經將字型檔案轉成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.
從訊息內容中可以看出,應該是像網站請求時header少了一些資訊
解決方法:
直接部屬到wordpress即可解決,參考資料