JS（JavaScript）检查系统内是否安装了某个字体 - 代码实现

擦拉嘿

于 2024-04-17 11:44:44 发布

阅读量165

点赞数 2

分类专栏： JavaScript语言文章标签： javascript

本文链接：https://blog.csdn.net/weixin_42655717/article/details/137866708

版权

JavaScript语言专栏收录该内容

4 篇文章 0 订阅

订阅专栏

// 检测用户系统是否安装了某个字体，字体名需英文（宋体 => SimSun）
export function isFontInstalled(fontName: string) {
  // 创建一个比较基准的canvas元素来获取默认宽度和高度
  const canvas = document.createElement('canvas');
  const context = canvas.getContext('2d');

  // 比较的基准字体应该是系统中不可能存在的
  const text = 'abcdefghijklmnopqrstuvwxyz0123456789';
  context.font = '72px "font that doesnt exist", monospace';

  // 获取比较基准的尺寸
  const baselineSize = context.measureText(text).width;

  // 再次设置需要检测的字体并获取其尺寸
  context.font = `72px "${fontName}", monospace`;
  const checkSize = context.measureText(text).width;

  // 如果两次返回的宽度相同，那么指定的字体可能未安装
  return checkSize !== baselineSize;
}