來自Azure CDN的請求字體文件被CORS策略阻止

所以我有一個Azure Web服務和一個Azure CDN。我的網絡服務在ASP.Net上運行核心來自Azure CDN的請求字體文件被CORS策略阻止

我對我的網站的index.html發出了一個請求，它開始從CDN下載資源。除字體文件外，所有資產都會加載。

這裏的錯誤：

Access to Font at 'https://CDN.azureedge.net/68.0.3/styles/ui-grid.woff' from origin 'https://WebApp.azurewebsites.net' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://WebApp.azurewebsites.net' is therefore not allowed access.

這裏是請求之一是這樣的：

所以我的理解是：從Web服務器

下載的index.html
index.html - >從CDN下載.css
.css - >從CDN下載字體
阻止？看起來瀏覽器阻止了請求，而不是CDN，這是否正確？如果是這樣，爲什僅僅因爲它是一個字體文件請求？

來源

2017-09-14 Hugh Myron

你看過：https://stackoverflow.com/questions/33197751/fonts-are-blocked-in-web-client-cors或https://stackoverflow.com/questions/25577981/原始字體 - 已被阻止 - 由交叉源 - 資源共享加載？ –

它看起來像那些亞馬遜簡單存儲服務，我不認爲我有權訪問.htaccess，或者是一個Web服務器文件不是一個CDN服務器文件？ –

如果沒有正確的配置，你不能從CDN中提取字體 - 這是一個不同的域，所以如果沒有正確的頭文件，瀏覽器就不能信任這些文件。

您只有一個選項 - 在CDN中設置正確的標題。如果你有機會到Apache或NGINX您可以設置：

阿帕奇

<FilesMatch ".(eot|ttf|otf|woff)"> 
    Header set Access-Control-Allow-Origin "*" 
</FilesMatch>

NGINX

if ($filename ~* ^.*?\.(eot)|(ttf)|(woff)$){ 
    add_header Access-Control-Allow-Origin *; 
}

如果您沒有訪問服務器設置，你不能從CDN使用的字體。

來源

2017-09-15 12:03:48

如果您使用的是Azure CDN的Verizon Premium SKU，則還可以通過CDN而不是原始服務器來設置CORS標頭。

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

來源

2017-09-15 19:33:30

來自Azure CDN的請求字體文件被CORS策略阻止

回答

相關問題