Nginx 跨域使用字体

今天在使用子域名访问根域名的CSS时，发现字体无法显示，在确保CSS和Font字体的路径加载无问题后，基本确定是因为跨域的问题。

通过Nginx模块HttpHeadersModule来添加Access-Control-Allow-Origin允许的地址。

解决方法

在Nginx的conf目录下修改nginx.conf或者vhost下对应的domain conf，添加以下代码：

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

更详细的Nginx的跨域配置，请查看下面的文章。

Wide-open CORS config for nginx

转载于:https://blog.51cto.com/ladder/1567585

Nginx 跨域使用字体相关推荐

Nginx跨域配置、限制连接、限制下载速度
目录一.Nginx跨域配置二.Nginx限制连接配置三.Nginx限制下载速度配置一.Nginx跨域配置 #允许跨域请求的域,* 代表所有 add_header 'Access-Control ...
vue项目打包部署nginx跨域
vue项目打包部署nginx跨域 vue项目连接外部api接口时,打包部署到nginx后出现api404,api跨域问题,这个时候需要给vue项目本身进行跨域,再配置nginx中进行跨域即可解决,详见 ...
nginx跨域步骤详情
此文章只实现在本地开发环境下的应用nginx跨域 1.下载nginx稳定版本下载地址:nginx: download 2. 配置nginx文件下的nginx.conf 3. 打包我用的react ...
nginx【nginx跨域、nginx开启gizp压缩、nginx服务器部署项目】
nginx是一个高性能的HTTP和反向代理服务器,它使用配置文件决定如何提供内容.要监听的端口等.因此常用来做静态资源服务器和后端的反向代理服务器. 安装:brew install nginx 启动: ...
iconfont配置nginx跨域问题、nginx反向代理接口跨域
1.nginx配置解决iconfont跨域浏览器跨域访问js.css.img等常规静态资源被同源策略许可,但iconfont字体文件(eot|otf|ttf|woff|svg)例外,此时可在ngin ...
Nginx跨域问题的案例演示
跨域问题的案例演示出现跨域问题会有什么效果?,接下来通过一个需求来给大家演示下: (1)nginx的html目录下新建一个a.html <html><head><met ...
Nginx跨域问题的原因分析
Nginx的跨域问题解决这块内容,我们主要从以下方面进行解决: 什么情况下会出现跨域问题? 实例演示跨域问题具体的解决方案是什么? 同源策略浏览器的同源策略:是一种约定,是浏览器最核心也是最基本 ...
Nginx跨域解决方案
问题描述当出现403跨域错误的时候 No 'Access-Control-Allow-Origin' header is present on the requested resource,需要给N ...
Nginx跨域解决配置示例
简介在日常学习和工作开发中,需要请求两个不同配置的请求经常存在,本文介绍如果还使用Nginx配置解决其跨域问题相关理论首先需要了解什么是跨域,下面的两个文章说的很好,请仔细阅读后,然后自己去动手 ...

Nginx 跨域使用字体

解决方法

Nginx 跨域使用字体相关推荐

最新文章

热门文章