`
li200429
  • 浏览: 149710 次
  • 性别: Icon_minigender_2
  • 来自: 青岛
社区版块
存档分类
最新评论

No 'Access-Control-Allow-Origin' header is present on the requested resource问题解决

阅读更多

最近写代码,前端请求老是出现:No 'Access-Control-Allow-Origin' header is present on the requested resource 这个错误的问题。网上也有很多种解决办法,我这里主要是通过在web.xml里设置CORS来解决嘴跨域问题。

首先需要在web.xml里配置filter:

<filter>
        <filter-name>CorsFilter</filter-name>
        <filter-class>org.apache.catalina.filters.CorsFilter</filter-class>
        <init-param>
            <param-name>cors.allowed.origins</param-name>
            <param-value>*</param-value>
        </init-param>
        <init-param>
            <param-name>cors.allowed.methods</param-name>
            <param-value>GET,POST,HEAD,OPTIONS,PUT</param-value>
        </init-param>
        <init-param>
            <param-name>cors.allowed.headers</param-name>
            <param-value>Host,Origin,X-Requested-With,Content-Type,Accept,AppKey,Nonce,CurTime,CheckSum,Accept-Encoding,Accept-Language,Connection,Content-Length,User-Agent,Referer</param-value>
        </init-param>
        <init-param>
            <param-name>cors.exposed.headers</param-name>
            <param-value>Access-Control-Allow-Origin,Access-Control-Allow-Credentials</param-value>
        </init-param>
</filter>

<filter-mapping>
      <filter-name>CorsFilter</filter-name>
      <url-pattern>/*</url-pattern>
</filter-mapping>

 

 注意,工程里需要依赖cors包,我用的是maven,配置如一下:

 

<dependency>
	<groupId>com.thetransactioncompany</groupId>
	<artifactId>cors-filter</artifactId>
	<version>1.7</version>
</dependency>

 

web.xml里需要注意: 

  • cors.allowed.methods:是要设置请求的方法,如果你只设置了post,请求是get也会报错;
  • cors.allowed.headers:请求的header里允许的内容。如果请求里的header不在这个白名单里,也会报同样的错误。
  • <url-pattern>/*</url-pattern>:设置允许请求的url,这里设置的/*就是所有的请求都允许,其实这样是会有安全问题。

cors的原理大家可以看一下另外两篇文章,写得比较详细。链接发出来:

http://www.cnblogs.com/huangjacky/p/4001073.html

http://www.cnblogs.com/Darren_code/p/cors.html

分享到:
评论

相关推荐

    静态文件访问不到报No Access-Control-Allow-Origin处理办法

    静态文件访问不到报No 'Access-Control-Allow-Origin' header is present on the requested resource处理办法

    Nginx跨域设置Access-Control-Allow-Origin无效的解决办法

    add_header 'Access-Control-Allow-Origin' '*'; add_header 'Access-Control-Allow-Credentials' 'true'; add_header 'Access-Control-Allow-Methods' 'GET,POST'; 使用以下配置,生效。 if ($request_method = '...

    Allow-Control-Allow-Origin

    解决浏览器跨域请求出现No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8100' is therefore not allowed access.问题

    vue跨域解决方法

    vue项目中,前端与后台进行数据请求或者提交的时候,如果后台没有设置跨域,前端本地调试代码的时候就会报“No ‘Access-Control-Allow-Origin’ header is present on the requested resource.” 这种跨域错误。...

    Nginx解决转发地址时跨域的问题

    No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. 这就是跨域问题。解决方案有不少,比较好的是服务器端配置CORS,但要求服务器端...

    230207-031shopDemo(抽离跨域异常处理管道中间件之CorsExceptionHandlerMiddleware)

     /// 2、“has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.”。  /// 3、“has been blocked by CORS policy: Response to preflight request...

    corsyusha:简单快速的代理,可在针对现有API进行原型设计时绕过CORS问题,而不必担心CORS

    has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch ...

    google cast demo

    依赖于CCL,...报XMLHttpRequest cannot load 和No 'Access-Control-Allow-Origin' header is present on the requested resource.的错误 暂时无解,我在服务器上已经enable了CORS

    完美解决浏览器跨域的几种方法(汇总)

    No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘http://当前页的域名’ is therefore not allowed access. 2、为什么会出现跨域问题 因为浏览器收到同

    快速解决Canvas.toDataURL 图片跨域的问题

    【Redirect at origin ‘http://sub1.xx.com’ has been blocked from loading by Cross-Origin Resource Sharing policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource....

    有关Ajax跨域问题的两种解决方法

    XMLHttpRequest cannot load http://192.168.2.12:8001/oss/api/version/check. No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘http://localhost:8000’ is therefor

    local-cors-proxy:简单的代理绕过CORS问题

    构建该模块是为了解决出现此错误的问题: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access. If an opaque ...

    详解Django解决ajax跨域访问问题

    这篇文章主要给大家介绍了关于Django跨域请求问题解决的相关资料,文中介绍的实现...No ‘Access-Control-Allow-Origin’ header is present on the requested resource. 这是由于CORS导致的。 什么是CORS? CORS

    Django使用中间件解决前后端同源策略问题

    问题描述 前端时间在公司的时候,要使用angular开发一个网站,因为angular很适合前后端分离,...No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:4200' is

    关于python的bottle框架跨域请求报错问题的处理方法

    XMLHttpRequest cannot load http://192.168.0.118:8081/get_mobile_number/?id=1. No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘null’ is therefore not

    PHP如何实现跨域

    No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘null’ is therefore not allowed access. 这是因为浏览器跨域策略起作用,阻止了跨域的请求。看看HTTP请求过程就知道...

    使用jsonp完美解决跨域问题

    调用web接口,get请求,发现提示:No ‘Access-Control-Allow-Origin’ header is present on the requested resource. 这个和安全机制有关,默认不允许跨域调用 处理手段:使用jsonp格式, ajax请求参数dataType:...

    完美解决axios跨域请求出错的问题

    Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘http://localhost:9000’ is therefore not ...

    PHP Ajax跨域问题解决方案代码实例

    XMLHttpRequest cannot load http://server.runoob.com/server.php. No ‘Access-Control-Allow-Origin’ header is present on the requested resource.Origin ‘http://client.runoob.com’ is theref

Global site tag (gtag.js) - Google Analytics