JS 判断字体是否包含特定字符的字型（预防SpreadJS导出PDF乱码）

收藏

本帖最后由 dexteryao 于 2024-12-10 10:47 编辑

SpreadJS 在导出PDF前需要为使用到的字体注册对应的字体文件以防止乱码。
但是字体文件并不会包含所有字符的字型描述。
例如英文字体并不会包含中文的字型，中文字体也不包含所有的中文文字。
所以对于特殊的字符即使注册了某个字体，如果字体中不包含该字符的字型描述也还会出现乱码。

那么为了防止出现此类情况，可以在导出前对于用到的字符做检查，判断是对应字体是否包含该字型，如果不存在可以给出提示，或者检测其他字体是否包含，通过富文本的方式更改某一个字符为其他字体。

检测字体可以使用fontkit（https://github.com/foliojs/fontkit）组件，它支持在node和浏览器环境中，对字体进行多种操作。
提供了hasGlyphForCodePoint接口，可以检查字型。

具体使用参考代码如下：
安装：

npm install fontkit

复制代码

引入：

import * as fontkit from 'fontkit';

复制代码

创建fontkit中的font对象

const buf = new Uint8Array(arrayBuffer);
const font = fontkit.create(buf);

复制代码

这里的arrayBuffer是注册过的字体文件
可以通过getFont拿到

var fonts = GC.Spread.Sheets.PDF.PDFFontsManager.getFont("微软雅黑");
var arrayBuffer = fonts["normal"]

复制代码

或者是之前请求过的字体

const response = await fetch(url);
const arrayBuffer = await response.arrayBuffer();

复制代码

然后就可以使用hasGlyphForCodePoint检查了

console.log(font.hasGlyphForCodePoint(65))
console.log(font.hasGlyphForCodePoint("".charCodeAt(0)))
console.log(font.hasGlyphForCodePoint("葡".charCodeAt(0)))

复制代码

中文字体文件本身就比较大，字符检查也会耗费较大的资源，如果对于复杂的内容还是建议在服务端通过GCExcel来做PDF的生成。
GCExcel会自动的检查字符，在字型不存在的情况下也会自动找到替代字型，无需自定义的代码检查操作。

不吐葡萄皮 · 不吐葡萄皮

Joestar.Xu · Joestar.Xu

		自动登录	找回密码
密码			立即注册

JS 判断字体是否包含特定字符的字型（预防SpreadJS导出PDF乱码）

2 个回复

讲师达人

悬赏达人

元老葡萄

SpreadJS 认证

SpreadJS 高级认证

微信认证勋章