将自定义字体导入 SAPUI5 应用程序

Question

我正在玩一个费用应用程序以获得一些外观和感觉，并且想使用 receipt-like 字体。所以我找到了 FakeReceipt 字体，将我的 woff 和 woff2 文件放在了与 style.css 相同的目录中，瞧！有效。

@font-face {
    font-family: 'FakeReceipt';
    src: url('FakeReceipt.woff') format('woff'),
     url('FakeReceipt.woff2') format('woff2');
    font-weight: normal;
    font-style: italic;
}

在本地主机上一切正常，我能够看到正确加载的字体，但是当我将它部署到开发服务器时，它在控制台显示警告：

解码下载字体失败：https://*********/sap/bc/ui5_ui5/sap//~04E3CA24FE6465024E9A6D765A0A6010~5/css/FakeReceipt.woff /sap/bc/ui5_ui5/ui2/ushell/shells/abap/FioriLaunchpad.html?saml2=禁用#ZExpense-create:1
OTS解析错误：解压后的WOFF 2.0字体大小超过30MB
OTS 解析错误：WOFF 中的文件大小不正确header

我仍然可以看到它在开发工具的网络选项卡上下载了字体，但是字体字符与本地主机不同，它看起来像一个通用字体，并且蒸发了主要目的。

我用的是个人版的SAP Webide 1.53.9 64bit, 1.71.13 sapui5 版本如果相关的话。

这是什么原因造成的？我试过我听说过的所有不同的浏览器。

谢谢！

Answer 1

一个 woff2 文件是一个二进制文件，我认为这个错误是由于 UI5 上传到 ABAP 没有正确分类文件造成的。

要告诉ABAP服务器这是一个二进制文件，需要在上传到ABAP的目录下创建一个.Ui5RepositoryBinaryFiles。此文件（连同相应的 .Ui5RepositoryTextFiles 文件）创建一个解释为二进制或文本的额外扩展列表。

文件中的每一行都是这样写的^.*\.woff2$以表示要包含的扩展名。

可以在 UI5 SDK 上找到更多信息 - https://ui5.sap.com/#/topic/a560bd6ed4654fd1b338df065d331872.html

同样重要的是要注意 IE11 不支持 woff2（如果您想支持该浏览器）- https://caniuse.com/#feat=woff2。通常，您需要定义一系列支持的字体，浏览器会停在它支持的字体上。

将自定义字体导入 SAPUI5 应用程序

Importing custom font to SAPUI5 application

css

custom-font

sapui5