nginx Access-Control-Allow-Origin css跨域
问题原因:nginx 服务器 css 字体跨域 以及img相对路径 问题
描述:用nginx做页面静态化时遇到了两个问题
1.我有两个静态资源服务器 static.xxx.com 和 item.xxx.com 。我的字体文件存在 static.xxx.com上,在用item.xxx.com 访问 static.xxx.com 的时候浏览器报以下错误
Font from origin 'http://static.xxx.com' has been blocked from loading by Cross-Origin Resource Sharing policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
Origin 'http://item.xxx.com' is therefore not allowed access.
问题的本质就是 css跨域请求。
Nginx 解决办法:
add_header Access-Control-Allow-Origin *;
add_header Access-Control-Allow-Headers X-Requested-With;
add_header Access-Control-Allow-Methods GET,POST,OPTIONS;
将这段代码添加到 http{}
或者静态资源对应的 server{}
中,
如果只为自己的网站使用可以将第一行代码的星号改为自己的域名,例如 *.xxx.org
2.图片的相对路径 <img src="/pictrue/1.jpg"/>
img 的相对路径是从 网站的根目录下开始查找,为了简单我把图片放到静态页面的跟目录下
参考链接:https://blog.fbzl.org/access-control-allow-origin-%E8%A7%A3%E5%86%B3%E8%B7%A8%E5%9F%9F%E6%9D%83%E9%99%90%E9%97%AE%E9%A2%98/
nginx Access-Control-Allow-Origin css跨域的更多相关文章
- 使用nginx反向代理处理前后端跨域访问
本文主要解决:使用nginx反向代理处理前后端跨域访问的问题 1.何为跨域访问? 以下类型为跨域访问 1)不同域名间访问 www.zuiyoujie.com和www.baidu.com 2)同域名不同 ...
- Access control allow origin 简单请求和复杂请求
原文地址:http://blog.csdn.net/wangjun5159/article/details/49096445 错误信息: XMLHttpRequest cannot load http ...
- 配置nginx反向代理服务器,解决浏览器跨域调用接口的限制问题
配置nginx反向代理服务器,解决浏览器跨域调用接口的限制问题 - 大venn的博客 - CSDN博客https://blog.csdn.net/u011135260/article/details/ ...
- nginx代理天地图做缓存解决跨域问题
作为一个GISer开发者,天地图是经常在项目中以底图的形式出现,其加载地址如: 天地图矢量:http://t{0-6}.tianditu.com/DataServer?T=vec_w&x={x ...
- nginx.config 多个方案解决跨域问题
#user nobody; user sam owner; worker_processes 1; #error_log logs/error.log; #error_log logs/error.l ...
- Nginx:多项目开发配置跨域代理
简述Nginx应用场景(前后端) 当我们开发 vue 项目中可以通过 proxyTable 进行跨域,但如果是原生的 html+css+js ,或者其他没有跨域插件的项目中,想要跨域就要引入配置许多的 ...
- 搭建nginx代理,为前端页面跨域调用接口
前端同学因开发需要,本地搭建的服务需要调用其它域名的接口,在帮助正确配置后,已能正常使用. 这里写一篇博客,记录一下. 前端页面地址为127.0.0.1:9813/a.html 接口地址http:// ...
- 20191204-使用nginx解决ajax测试调用接口跨域问题
问题描述 之前要测试一个http的接口,在postman中测试成功,但使用ajax调用却跨域.于是通过使用ngin反向代理的方式来解决ajax调用跨域问题 测试页面的内容 <html> & ...
- 利用nginx做反向代理解决前端跨域问题
最近朋友再群里提了一个问题,他们公司给他提供了一个获取数据的接口,在浏览器访问这个接口能获取到json数据,但是放在项目里使用ajax就产生了跨域问题,一般这个需要提供接口的后台方面需要做跨域处理,但 ...
随机推荐
- Java Web之HTML5
终于学到Java Web这一章节了,首先来了解一下HTML5的一些新知识点吧,我直接贴出HTML5代码看一下: <!DOCTYPE html> <html lang="en ...
- Java动态代理之JDK实现和CGlib实现(简单易懂)
转载请注明原文地址:http://www.cnblogs.com/ygj0930/p/6542259.html 一:代理模式(静态代理) 代理模式是常用设计模式的一种,我们在软件设计时常用的代理一般是 ...
- JAVA核心技术I---JAVA基础知识(格式化相关类)
一:格式化相关类 (一)java.text包java.text.Format的子类 –NumberFormat:数字格式化,抽象类 DecimalFormat –MessageFormat:字符串格式 ...
- C语言复习---输出魔方阵
一:奇魔方阵 算法: 1.第一个元素放在第一行中间一列 .下一个元素存放在当前元素的上一行.下一列. .如果上一行.下一列已经有内容,则下一个元素的存放位置为当前列的下一行. 在找上一行.下一行或者下 ...
- Linux-CentOS 查看(监控)服务器网卡流量
1.使用系统自带的命令: watch more /proc/net/dev 2. 使用nload命令,需要自行安装 1)# yum install flex byacc libpcap ncurses ...
- Program License Agreement updated/The updated Apple Developer Program License Agreement needs to be reviewed.
Apple APP添加新APP时提示The updated Apple Developer Program License Agreement needs to be reviewed. 解决办法 登 ...
- 02-Unity深入浅出(二)
一. Unity声明周期 Unity容器为我们提供了6种生命周期,便于我们根据项目需求来选择使用. (1). 瞬时.默认省略即为瞬时,无论单线程还是多线程,每次都重新创建对象.new Transien ...
- C#编程思想(持续更新)
1.将约束的参数先用变量保存,一定不变的设为const,在使用时不直接填入数字而是使用这些变量,这样可以很大程度上方便后续参数的修改 2.字段先用属性封装后,所有的调用都使用属性而不是字段 3.要返回 ...
- Newtonsoft.Json 的高级用法
Ø 简介 接着前一篇http://www.cnblogs.com/abeam/p/8295765.html,继续研究 Newtonsoft.Json 的一些高级用法.主要包括: 1. JSON ...
- ASP.NET Web API 2 使用 AuthorizationFilter(授权过滤器)实现 Basic 认证
Ø 前言 在 Web 项目中授权认证方式有很多种,本文主要讲述基于 Basic 的认证方式.这是一种比较简单.常见的认证方式,主要是将请求的用户名和密码进行加密后返回给调用方,比较适合采用用户名.密 ...