將base64格式的字型資訊解碼成可用的字型檔案
阿新 • • 發佈：2018-12-17
好奇檢查了一下這是什麼字型：
。。好吧我確定沒有這個字型，那就是自定義的字型了。
檢查了HTTP請求，有這麼一個請求：
雖然請求的都是字型檔案但是第一個明顯更清新脫俗一些，他是base64編碼的，data:font/opentype;base64,T1RUTwAJAIAAAwAQQ0ZGIBcEq…過長不展示
查了一下如何將其轉為可用的字型檔案：
好吧 我再複述一下過程：
- 獲取到base64字串並刪除頭部資訊，在這裡就是data:font/opentype;base64, 逗號也要刪除，這樣就獲取到了字型資訊。 比如：T1RUTwAJAIAAAwAQQ0ZGIBcEq…過長不展示 。
- 訪問http://www.motobit.com/util/base64-decoder-encoder.asp 這個網站，將純字型資訊字串貼上進編輯區域，然後下方解碼選項選擇解碼base64字串 和匯出為二進位制檔案，即：
- 點選轉換資料，這樣就下載下來一個base64.bin的二進位制檔案，然後用編輯工具開啟，在前面會發現一些字型格式的關鍵字，比如ttf，woff，otf…我的關鍵字是這樣的：
我就預設設定為otf格式的了。。 4.然後將base64.bin 問價改名為 pixelEn.otf， 檔名隨意。
到此完成，我們可以試試字型效果怎麼樣，建議一個html檔案：
<!DOCTYPE html> <html> <head> <title></title> <style type="text/css"> @font-face { font-family: "pixelEn"; src: url("pixelEn.otf"); } p { font-family: "pixelEn"; font-size: 24px; } </style> </head> <body> <p>This is pixelEn.otf</p> </body> </html>
效果：
這個網站請求了2個字型檔案，我們使用的是英文字元的”畫素化”字型，上圖中第二個就是中文”畫素化”的字型檔案，有興趣可以下載下來使用。