Phpdesktop chrome 不加载字体
Posted
技术标签:
【中文标题】Phpdesktop chrome 不加载字体【英文标题】：Phpdesktop chrome not loading fonts 【发布时间】：2021-12-15 20:14:07 【问题描述】：我正在构建一个 php 桌面 chrome 应用程序，后面有 Laravel8，前面有 angular/ionic/它运行良好，但 php 桌面没有通过网络加载我的谷歌字体，我不知道为什么： 我的 index.html：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Ionic App</title>
<base href="/" />
<link href = "assets/google-font.css" rel = "stylesheet" type="text/css"/>
<meta name="color-scheme" content="light dark" />
<meta name="viewport" content="viewport-fit=cover, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="format-detection" content="telephone=no" />
<meta name="msapplication-tap-highlight" content="no" />
<link rel="icon" type="image/png" href="assets/icon/favicon.png" />
<!-- add to homescreen for ios -->
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
</head>
<body>
<app-root></app-root>
</body>
</html>
google-font.css如下：
/* cyrillic-ext */
@font-face
font-family: 'Roboto';
font-style: normal;
font-weight: 100;
font-display: swap;
src: url(https://fonts.gstatic.com/s/roboto/v29/KFOkCnqEu92Fr1MmgVxFIzIFKw.woff2) format('woff2');
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
/* cyrillic */
@font-face
font-family: 'Roboto';
font-style: normal;
font-weight: 100;
font-display: swap;
src: url(https://fonts.gstatic.com/s/roboto/v29/KFOkCnqEu92Fr1MmgVxMIzIFKw.woff2) format('woff2');
unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
/* greek-ext */
@font-face
font-family: 'Roboto';
font-style: normal;
font-weight: 100;
font-display: swap;
src: url(https://fonts.gstatic.com/s/roboto/v29/KFOkCnqEu92Fr1MmgVxEIzIFKw.woff2) format('woff2');
unicode-range: U+1F00-1FFF;
/* greek */
@font-face
font-family: 'Roboto';
font-style: normal;
font-weight: 100;
font-display: swap;
src: url(https://fonts.gstatic.com/s/roboto/v29/KFOkCnqEu92Fr1MmgVxLIzIFKw.woff2) format('woff2');
unicode-range: U+0370-03FF;
/* vietnamese */
@font-face
font-family: 'Roboto';
font-style: normal;
font-weight: 100;
font-display: swap;
src: url(https://fonts.gstatic.com/s/roboto/v29/KFOkCnqEu92Fr1MmgVxHIzIFKw.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
/* latin-ext */
@font-face
font-family: 'Roboto';
font-style: normal;
font-weight: 100;
font-display: swap;
src: url(https://fonts.gstatic.com/s/roboto/v29/KFOkCnqEu92Fr1MmgVxGIzIFKw.woff2) format('woff2');
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
/* latin */
@font-face
font-family: 'Roboto';
font-style: normal;
font-weight: 100;
font-display: swap;
src: url(https://fonts.gstatic.com/s/roboto/v29/KFOkCnqEu92Fr1MmgVxIIzI.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
google 字体中的 src url 无法在 php 桌面 chrome 中加载，但在浏览器中运行良好，这是怎么回事？ - - - - - - - - - - -编辑 - - - - - - - - - - - 好的，经过进一步的故障排除后，我发现 php desktop chrome 不会加载通过网络提供的资产 例如
<link href = "http://www.test.com/test.css" rel = "stylesheet"/>
上面会加载失败，这是chrome的问题，我该如何纠正？
【问题讨论】：
【参考方案1】：要解决此问题，您可以在 Angular 应用中捆绑样式。
在angular.json 中找到具有数组值的“styles”属性（第一个不是测试属性，尽管您可以同时添加两者）。
添加这个：
"styles": [
"src/assets/google-font.css"
"src/styles.scss"
]
显然，请确保将文件添加到资产文件夹。希望对你有帮助，上帝保佑。
您可以从 index.html 中删除该条目
【讨论】：
以上是关于Phpdesktop chrome 不加载字体的主要内容，如果未能解决你的问题，请参考以下文章
Chrome 打印预览不加载 @media only print font-face
使用 Google 字体的 Chrome 上的 CORS 错误
最新的 Chrome (46.0.2490.7) 无法通过 https CORS 从 S3 存储桶加载字体