如何添加Access-Control-Allow-Origin標頭

我正在設計一個網站（例如mywebsite.com），並且此網站從另一個網站（稱爲anothersite.com）加載字體字體。我是有在Firefox中字型字體加載的問題，我在讀this blog：如何添加Access-Control-Allow-Origin標頭

火狐（從V3.5支持@字體面）不允許跨域字體默認。這意味着必須從相同域（和子域）提供字體，除非您可以將「訪問控制 - 允許來源」標頭添加到字體中。

如何將Access-Control-Allow-Origin標頭設置爲字體？

來源

2011-02-15 Ash

141

所以你要做的是...在字體文件文件夾中放置一個htaccess文件，其中包含以下內容。

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

也是在遠程CSS文件，字體-face聲明所需要的字體文件（不需要在本地CSS文件）的完整的絕對網址：

例如

@font-face { 
    font-family: 'LeagueGothicRegular'; 
    src: url('http://www.mysite.com/css/fonts/League_Gothic.eot?') format('eot'), 
     url('http://www.mysite.com/css/fonts/League_Gothic.woff') format('woff'), 
     url('http://www.mysite.com/css/fonts/League_Gothic.ttf') format('truetype'), 
     url('http://www.mysite.com/css/fonts/League_Gothic.svg') 

}

這將解決問題。需要注意的一點是，您可以準確指定應允許哪些域訪問您的字體。在上述htaccess的我已經指定了每個人都可以訪問我的字體與"*"但是你可以限制它：

單個URL：

Access-Control-Allow-Origin: http://yoursite.com

~~或逗號分隔的URL列表~~

~~Access-Control-Allow-Origin: http://yoursite.com,http://anothersite.com~~

（當前實現中不支持多個值）

來源

2011-02-15 20:28:01 Ash

您不必使用完整路徑。假設您將'fonts'文件夾保存在與.css文件相同的目錄中，那麼簡單的`url（'/ fonts/League_Gothic.woff'）格式（'woff'）`就足夠了。 – StrayObject 2011-12-14 14:03:01

此解決方案也適用於跨域.ajax請求！太好了！ – Isaac 2011-12-14 15:20:09

據the official docs，瀏覽器不當您使用

Access-Control-Allow-Origin: "*"

頭，如果您還使用了

Access-Control-Allow-Credentials: "true"

頭喜歡它。相反，他們希望你特別允許他們的出身。如果你仍然要允許所有來源，你可以做一些簡單的Apache魔術得到它的工作（確保已啓用mod_headers）：

Header set Access-Control-Allow-Origin "%{HTTP_ORIGIN}e" env=HTTP_ORIGIN

瀏覽器都需要發送Origin標題上的所有跨域要求。該文檔明確指出，如果您接受/計劃接受請求，則需要在Access-Control-Allow-Origin標題中回顯此標題。這就是這個Header指令正在做的事情。

來源

2013-07-30 17:40:17 laughingbovine

檢查此鏈接..它肯定會解決您的問題.. 有很多解決方案可以使跨域GET Ajax調用 但是跨域的POST請求解決在這裏。我花了3天才弄明白。

http://blogs.msdn.com/b/carlosfigueira/archive/2012/02/20/implementing-cors-support-in-asp-net-web-apis.aspx

來源

2013-09-30 12:13:38 user2440156

對於Java基於應用程序添加到您的web.xml文件：

<servlet-mapping> 
    <servlet-name>default</servlet-name> 
    <url-pattern>*.ttf</url-pattern> 
</servlet-mapping> 

<servlet-mapping> 
    <servlet-name>default</servlet-name> 
    <url-pattern>*.otf</url-pattern> 
</servlet-mapping> 

<servlet-mapping> 
    <servlet-name>default</servlet-name> 
    <url-pattern>*.eot</url-pattern> 
</servlet-mapping> 

<servlet-mapping> 
    <servlet-name>default</servlet-name> 
    <url-pattern>*.woff</url-pattern> 
</servlet-mapping>

來源

2014-01-15 19:27:05

接受的答案沒有工作對我來說不幸的是，因爲我的網站的CSS文件@import字體CSS文件，並且這些文件都存儲在Rackspace Cloud Files CDN上。

由於Apache的頭永遠不會發生（因爲我的CSS是不是在Apache），我不得不做幾件事情：

轉到雲中的文件的用戶界面，並添加自定義標題（接入控制 - 允許來源與值*）每個字體真棒文件
更改WOFF和TTF文件的內容類型，以字體/ WOFF分別

字體/ TTF看看你能不能逃脫只是＃1，因爲第二個需要一些命令行工作。

要添加＃1自定義標題：

查看雲文件容器文件
向下滾動到文件
點擊齒輪圖標
單擊編輯頁眉
select Access-Control-Allow-Origin
添加單個字符'*'（不含引號）
命中進入
重複其他文件

如果您需要繼續做＃2，那麼你就需要用捲曲

curl -D - --header "X-Auth-Key: your-auth-key-from-rackspace-cloud-control-panel" --header "X-Auth-User: your-cloud-username" https://auth.api.rackspacecloud.com/v1.0

從結果返回的命令行，提取值X-驗證令牌和X-存儲的URL

curl -X POST \ 
    -H "Content-Type: font/woff" \ 
    --header "X-Auth-Token: returned-x-auth-token" returned-x-storage-url/name-of-your-container/fonts/fontawesome-webfont.woff 

curl -X POST \ 
    -H "Content-Type: font/ttf" \ 
    --header "X-Auth-Token: returned-x-auth-token" returned-x-storage-url/name-of-your-container/fonts/fontawesome-webfont.ttf

當然，這個過程只有當您正在使用Rackspace公司CDN的工作原理。其他CDN可能提供類似的工具來編輯對象標題和更改內容類型，所以也許你會很幸運（並在此發佈一些額外的信息）。

來源

2014-03-27 19:38:51 Phil

在您的請求ajax的file.php中，可以設置值標頭。

<?php header('Access-Control-Allow-Origin: *'); //for all ?>

來源

2015-09-03 13:11:24

如何添加Access-Control-Allow-Origin標頭

回答

相關問題