4

我一直在按照本教程为云服务启用 Azure CDN： 链接。我将我的捆绑和缩小与 CDN 集成在一起，一切正常，除了我的网站无法获取字体，我收到了这个错误：

Font from origin 'http://azurecdn.vo.msecnd.net' has been blocked from loading by Cross-Origin Resource Sharing policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http:// mysite.com' is therefore not allowed access.

我厌倦了从我的问题中找到解决方案，并将这些行添加到我的 Web.config 文件中：

  <httpProtocol>
  <customHeaders>
    <add name="access-control-allow-origin" value="*" />
    <add name="access-control-allow-headers" value="content-type" />
  </customHeaders>
</httpProtocol>
   <rewrite>
  <outboundRules>
    <rule name="Set Access-Control-Allow-Origin header">
      <match serverVariable="RESPONSE_Access-Control-Allow-Origin" pattern="(.*)" />
      <action type="Rewrite" value="*" />
    </rule>
  </outboundRules>
  <rules>

    <rule name="RewriteIncomingCdnRequest" stopProcessing="true">
      <match url="^cdn/(.*)$"/>
      <action type="Rewrite" url="{R:1}"/>
    </rule>
  </rules>
</rewrite>

但这并没有帮助，我还发现了诸如此类的问题和答案：link，但这仅在您使用 CDN + Blob 存储（我没有使用）时才有帮助

我该如何解决这个问题？

编辑

我从我的包中删除了字体并在没有 CDN 的情况下将它们链接起来，这样就成功了，但这并不能完全解决这个问题

4

3 回答 3

2

Azure CDN 的这种重写配置对我有用...

<rewrite>
    <outboundRules>
        <rule name="Set Access Control Allow Origin Header" preCondition="Origin header">
            <match serverVariable="RESPONSE_Access-Control-Allow-Origin" pattern="(.*)" />
            <action type="Rewrite" value="*" />
        </rule>
        <preConditions>
            <preCondition name="Origin header" logicalGrouping="MatchAll">
                <add input="{HTTP_ORIGIN}" pattern="(.+)" />
                <add input="{HTTP_X_ORIGINAL_URL}" pattern="^/cdn/(.*)$" />
            </preCondition>
        </preConditions>
    </outboundRules>
    <rules>
        <rule name="Rewrite CDN requests" stopProcessing="true">
            <match url="^cdn/(.*)$" />
            <action type="Rewrite" url="{R:1}" />
        </rule>
    </rules>
</rewrite>

对于来自 Azure CDN 的每个请求（以 开头的 url cdn/）包含非空的Origin:http 标头，它会将Access-Control-Allow-Origin: *http 标头添加到响应中。

于 2015-04-17T12:52:33.877 回答
1

回答这个问题以防它帮助其他人寻找解决方案。在 Azure CDN 中，你可以在 Verizon Premium 配置文件上设置规则以启用 CORS。

https://azure.microsoft.com/en-us/documentation/articles/cdn-cors/

这也将允许您指定允许访问的域的明确列表，而不仅仅是通配符。

于 2016-10-06T22:42:03.067 回答
0

在以我的 Azure Web 应用程序为源创建 Azure CDN 时，我遇到了同样的问题。

最后，我对您使用了类似的解决方法。

我替换了我的@font-face 声明的 src 属性以使用谷歌字体 cdn。并不总是适合每个人的选择，但它对我有用。

@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: local('Roboto'), local('Roboto-Regular'), url(https://fonts.gstatic.com/s/roboto/v15/NdF9MtnOpLzo-noMoG0miPesZW2xOQ-xsNqO47m55DA.woff2) format('woff2');
  unicode-range: U+0102-0103, U+1EA0-1EF9, U+20AB;
}

在此处查看 google 提供的所有字体：https ://fonts.google.com/

希望这对某人有帮助！

于 2016-09-20T23:36:07.517 回答