Nginx實現(xiàn)跨域使用字體文件的配置詳解
更新時間：2017年06月26日 09:12:14 作者：Carey
這篇文章主要給大家介紹了關于Nginx實現(xiàn)跨域使用字體文件的配置方法，文中通過示例代碼介紹的非常詳細，對大家具有一定的參考學習價值，需要的朋友們下面來一起看看吧。
本文主要給大家介紹了關于Nginx跨域使用字體文件的相關內(nèi)容，分享出來供大家參考學習，下面來一起看看詳細的介紹：
問題描述
今天在使用子域名訪問根域名的CSS時，發(fā)現(xiàn)字體無法顯示，在確保CSS和Font字體的路徑加載無問題后，基本確定是因為跨域的問題。
通過Nginx模塊Http_Headers_Module來添加Access-Control-Allow-Origin允許的地址
console報錯信息
ccess to Font at 'http://w001.static.akhack.com/css/KohinoorBangla-Regular.ttf' from origin 'http://carey.akhack.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://carey.akhack.com' is therefore not allowed access.
解決方法
location ~* \.(eot|ttf|woff|svg|otf)$ {
add_header Access-Control-Allow-Origin http://carey.akhack.com;
add_header Access-Control-Allow-Headers X-Requested-With;
add_header Access-Control-Allow-Methods GET,POST,OPTIONS;
}
注意
add_header Access-Control-Allow-Origin http://carey.akhack.com; //只允許單域名或者 ‘*' 。不推薦 ‘*' ，會導致安全問題
總結
以上就是這篇文章的全部內(nèi)容了，希望本文的內(nèi)容對大家的學習或者工作能帶來一定的幫助，如果有疑問大家可以留言交流，謝謝大家對腳本之家的支持。
相關文章
這篇文章主要介紹了nginx搭建文件服務器,本文通過實例代碼給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值，需要的朋友可以參考下2023-06-06
Nginx(PHP/fastcgi)的PATH_INFO問題
PATH_INFO是一個CGI 1.1的標準，經(jīng)常用來做為傳參載體. 比如, 我們可以使用PATH_INFO來代替Rewrite來實現(xiàn)偽靜態(tài)頁面, 另外不少PHP框架也使用PATH_INFO來作為路由載體.2011-08-08
Ubuntu上安裝Nginx服務器程序及簡單的環(huán)境配置小結
Nginx是一款高性能的異步非阻塞服務器應用程序,人氣相當高,這里我們就來看一下在Ubuntu上安裝Nginx服務器程序及簡單的環(huán)境配置小結:2016-07-07
這篇文章主要介紹了Nginx中root與alias區(qū)別?,通過兩個小例子來學習root和alias的區(qū)別，對Nginx中root與alias區(qū)別感興趣的朋友跟隨小編一起看看吧2022-08-08
這篇文章主要介紹了Logrotate如何實現(xiàn)每小時切割日志文件問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-05-05
現(xiàn)在的后端開發(fā)，動不動就是需要https，或者說是需要ssl證書，既然沒有正版的證書，那么我們只能自己制作ssl的證書了。 證書的制作采用的是openssl工具，如果沒有，可以自行安裝下，因為筆者是在linux（ubuntu）下制作，所以一般是使用包管理工具（apt）安裝好了的2021-06-06
在項目開發(fā)過程中,總是離不開日志解析的工作,雖然有些時候覺得確實挺繁瑣的,但是靜下心來會發(fā)現(xiàn)有時候也是挺有趣的1件工作。 下面這篇文章主要介紹了使用MongoDB分析Nginx日志的方法,需要的朋友可以參考借鑒，一起來看看吧。2017-01-01
nginx配置域名訪問時域名后出現(xiàn)兩個斜杠//的解決方法
最近這兩天重新寫了一下我的個人網(wǎng)站，在阿里云新買了一臺服務器，配置好以后出現(xiàn)了一個問題，就是輸入域名后域名地址會自動在后面追加兩個斜桿,需要的朋友可以參考下2020-07-07
這篇文章主要介紹了Nginx服務狀態(tài)監(jiān)控的方法,小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-06-06
這篇文章主要介紹了nginx location匹配實例詳解的相關資料,需要的朋友可以參考下2017-06-06