在 WKWebView 中使用自定义本地字体

Question

我正在尝试在WKWebView 中呈现的一些动态 HTML 的 CSS 中使用本地字体（随应用程序安装的字体）。我已经阅读了许多 Stack Overflow 帖子和 webpage。回顾我所做的：

字体（在本例中为 ImpactLTStd.otf）是 iOS 应用程序的一部分。

在应用程序提供的字体部分中作为应用程序列表的一部分输入。

根据引用的网页，我可以确认 ImpactLTStd.otf 列在 Build Phases 的 Copy Bundle Resources 部分，并让我相信 @987654325 @ 与应用程序正确绑定。

字体在 CSS 中被列为：

<style> @font-face {font-family: 'Impact LT Std'; src: local('Impact LT Std'), local('ImpactLTStd'), url('ImpactLTStd.otf'); format('opentype'); } </style>

我以两种不同的方式引用字体（一种按字体系列，另一种按字体名称，以便查看哪个有效，哪个无效）：

<style>  .box_root {    overflow: auto;    background-color: #000000;    padding-top: 1.5em;    padding-bottom: 1.5em;    padding-left: 1.5em;    max-width: 1440px;    max-height: 640px;    display: table;  }  .box_title {    color: #ffd300;    line-height: 1em;    font-size: 85pt;    font-size: 6vw;    font-family: 'Impact LT Std';    text-transform: uppercase;  }  .box_description {    padding-top: .5em;    line-height: 1em;    color: #ffffff;    font-size: 65pt;    font-size: 4vw;    font-weight: bold;    font-family: 'ImpactLTStd';  } 

我使用 loadHTMLString 将 HTML 加载到 WKWebView：

webView.loadHTMLString(getHtml(), baseURL: nil)

但是，使用 CSS 标记在 WKWebView 中显示的 HTML 文本不使用 Impact 字体，而是使用一些看起来像 Times New Roman 的默认字体。

有人知道我做错了什么步骤吗？

Answer 1

您在加载 HTML 字符串时没有提供基本 URL，这将导致字体加载失败。尝试访问你的包的主要资源路径，如下所示：

if let resourcePath = Bundle.main.resourcePath {
    let url = URL.init(fileURLWithPath: resourcePath)
    webView.loadHTMLString(getHtml(), baseURL: url)
}