如何修复“缺少跨源资源共享 (CORS) 响应标头"webfont 问题? [英] How can I fix the 'Missing Cross-Origin Resource Sharing (CORS) Response Header' webfont issue?

问题描述

由于某种原因，字体已停止在我的网站上呈现.字体存储在本地，与站点位于同一台服务器上.

For some reason fonts have stopped rendering on my sites. The fonts are stored locally, on the same server as the site.

我查了一下问题，它似乎是缺少跨源资源共享 (CORS) 响应标头，但我无法理解此问题的解决方案.

I looked up the problem and it seems to be a Missing Cross-Origin Resource Sharing (CORS) Response Header but I cannot understand the solution for this.

各种网站都说要做的是使用:Access-Control-Allow-Origin:*

All the various sites say to do is to use: Access-Control-Allow-Origin:*

但由于我主要是前端，我不知道把它放在哪里.我的房东可以帮忙解决这个问题吗?

But as I'm primarily front end I do not know where to put it. Is this something my host can help with?

我能做些什么来解决这个问题?

What can I do to fix the issue?

相关网站是:http://cyclistinsuranceaustralia.com.au/

例如，右上角的电话号码应该是 Bebas 字体，但默认为 Impact.

The phone number, for example, at the top right should be Bebas font but it is defaulting to Impact.

在控制台中，我收到错误:

In the console, I get the errors:

来自原始字体 'http://www.cyclistinsuranceaustralia.com.au' 已被 Cross-Origin 阻止加载资源共享策略:Access-Control-Allow-Origin"标头的值为http://www.cyclistinsuranceaustralia.com.au' 不等于提供的原点.Origin 'http://cyclistinsuranceaustralia.com.au' 因此不允许访问.

Font from origin 'http://www.cyclistinsuranceaustralia.com.au' has been blocked from loading by Cross-Origin Resource Sharing policy: The 'Access-Control-Allow-Origin' header has a value 'http://www.cyclistinsuranceaustralia.com.au' that is not equal to the supplied origin. Origin 'http://cyclistinsuranceaustralia.com.au' is therefore not allowed access.

我联系了我的房东，他说要放:

I contact my host who said to put:

Access-Control-Allow-Origin "http://www.cyclistinsuranceaustralia.com.au"

在我的 .htaccess 文件中，但这没有变化.

in my .htaccess file but this has no change.

推荐答案

在你的 HTML 中你已经设置了一个base"标签:

In your HTML you have set a "base" tag:

<base href="http://www.cyclistinsuranceaustralia.com.au/">

1. 如果不需要，请从 HTML 中删除该行.从 http://cyclistinsuranceaustralia.com.au 中查看时，这应该可以使字体正常工作.
2. 您可能需要将 http://www.cyclistinsuranceaustralia.com.au 重定向到 http://cyclistinsuranceaustralia.com.au

1. Delete that line from your HTML if you don't need it. This should make the fonts work when viewed from http://cyclistinsuranceaustralia.com.au.
2. You'll probably need to redirect http://www.cyclistinsuranceaustralia.com.au to http://cyclistinsuranceaustralia.com.au

这篇关于如何修复“缺少跨源资源共享 (CORS) 响应标头"webfont 问题?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！