為Azure CDN上的網站啟用CORS以托管字體

Question

我有一個Azure網站（Asp.net MVC），其中包括字體（例如字體很棒，字形），並且可以在自定義域中使用，比如www.mywebsite.com。

我還設置了一個Azure CDN，其源主機指向網站（而不是blob存儲）。 另外，我正在使用cdn的自定義域名，例如“cdn.mywebsite.com”。

我遇到的問題是瀏覽器拒絕下載字體，因為沒有啟用CORS。 我已經找到了在Azure blob存儲上啟用CORS的方法，但我真的更願意通過將CDN指向網站來實現這項工作。

關於如何做到這一點的任何想法？

Answer 1

假設您的web.config system.webserver部分中有一些基本的CDN重寫規則，您還可以添加一些出站規則來為CDN請求啟用CORS ...

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

此出站規則通過Azure CDN向每個包含非空Origin:請求標頭的請求添加Access-Control-Allow-Origin: *響應標頭。