CORSFilter 跨域资源访问

时间：2021-11-11 17:08:17

CORS 定义

Cross-Origin Resource Sharing（CORS）跨来源资源共享是一份浏览器技术的规范，提供了 Web 服务从不同域传来沙盒脚本的方法，以避开浏览器的同源策略，是 JSONP 模式的现代版。与 JSONP 不同，CORS 除了 GET 要求方法以外也支持其他的 HTTP 要求。用 CORS 可以让网页设计师用一般的 XMLHttpRequest，这种方式的错误处理比 JSONP 要来的好。另一方面，JSONP 可以在不支持 CORS 的老旧浏览器上运作。现代的浏览器都支持 CORS。

CORS是W3c工作草案，它定义了在跨域访问资源时浏览器和服务器之间如何通信。CORS背后的基本思想是使用自定义的HTTP头部允许浏览器和服务器相互了解对方，从而决定请求或响应成功与否。W3C CORS 工作草案
同源策略：是浏览器最核心也最基本的安全功能；同源指的是：同协议，同域名和同端口。精髓：认为自任何站点装载的信赖内容是不安全的。当被浏览器半信半疑的脚本运行在沙箱时，它们应该只被允许访问来自同一站点的资源，而不是那些来自其它站点可能怀有恶意的资源；参考:JavaScript 的同源策略
JSON & JSONP:JSON 是一种基于文本的数据交换方式，或者叫做数据描述格式。JSONP是资料格式JSON的一种“使用模式”，可以让网页从别的网域要资料，由于同源策略，一般来说位于server1.example.com的网页无法与不是 server1.example.com的服务器沟通，而HTML的script元素是一个例外。利用script元素的这个开放策略，网页可以得到从其他来源动态产生的JSON资料，而这种使用模式就是所谓的JSONP

CORS 对比 JSONP

都能解决 Ajax直接请求普通文件存在跨域无权限访问的问题

  1. JSONP只能实现GET请求，而CORS支持所有类型的HTTP请求
  2. 使用CORS，开发者可以使用普通的XMLHttpRequest发起请求和获得数据，比起JSONP有更好的错误处理
  3. JSONP主要被老的浏览器支持，它们往往不支持CORS，而绝大多数现代浏览器都已经支持了CORS

CORS，BROWSER支持情况

数据来源：caniuse.com

IE6,IE7,Opera min 不支持CORS。具体可参看数据来源中的 'show all'

CORSFilter 跨域资源访问

主要用途

  • From a browser script perspective: By allowing cross-domain requests, which are subject to tighter controls on the types of data that is exchanged. Cookies, for instance, are blocked unless specifically requested by the XHR author and allowed by the cross-domain web service. This is done to mitigate the risk of data leaks.
  • From a web service perspective: By utilising the origin URL reported by the browser the target cross-domain web service can determine, based on its origin policy, whether to allow or deny the request.

Ajax请求跨域资源的异常

当出现如下异常时，那么就需要考虑跨域的问题了
例如 localhost:63343 通过Ajax请求http://192.168.10.61:8080服务器资源时就会出现如下异常：

CORSFilter 跨域资源访问

CORS 实现思路

CORS背后的基本思想是使用自定义的HTTP头部允许浏览器和服务器相互了解对方，从而决定请求或响应成功与否

安全说明

CORS is not about providing server-side security. The Origin request header is produced by the browser and the server has no direct means to verify it.

CORS 并不是为了解决服务端安全问题，而是为了解决如何跨域调用资源。至于如何设计出 安全的开放API，却是另一个问题了，这里提下一些思路：

  1. 请求时间有效性（验证timestamp与服务接到请求的时间相差是否在指定范围内，比如5分钟内）
  2. token验证
  3. ip验证
  4. 来源验证

例如

    {

        'name': 用户名,

        ‘key: 加密的验证key,//(name+secret+timestamp来通过不可逆加密生成)

        ‘timestamp’: 时间戳,//验证timestamp与服务接到请求的时间相差是否在指定范围内，比如5分钟内

    }

支持多域名配置的CORS Filter

因为知道已经有可以用的库可以解决，所以就没重复造*了。其实因为懒，看看别人的源码算了。。。

在mvnrepository搜索cors-filter,目前也就两个可以用

这两个也都大同小异，因为ebay开源在github上，也有详细的README，那么就以ebay的cors-filter为例

配置

添加依赖包到项目：

<dependency>

    <groupId>org.ebaysf.web</groupId>

    <artifactId>cors-filter</artifactId>

    <version>1.0.1</version>

</dependency>

添加配置(具体配置项，还是见项目的README.md吧）

  <filter>

    <filter-name>CORS Filter</filter-name>

    <filter-class>org.ebaysf.web.cors.CORSFilter</filter-class>

    <init-param>

      <param-name>cors.allowed.origins</param-name>

      <param-value>http://192.168.56.129,http://192.168.56.130</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>Content-Type,X-Requested-With,accept,Origin,Access-Control-Request-Method,Access-Control-Request-Headers</param-value>

    </init-param>

  </filter>

  <filter-mapping>

    <filter-name>CORS Filter</filter-name>

    <url-pattern>/*</url-pattern>

  </filter-mapping>

　当一个资源从与该资源本身所在的服务器不同的域或端口不同的域或不同的端口请求一个资源时，资源会发起一个跨域 HTTP 请求。

　　出于安全考虑，浏览器会限制从脚本内发起的跨域HTTP请求。跨域资源共享机制允许 Web 应用服务器进行跨域访问控制，从而使跨域数据传输得以安全进行。浏览器支持在 API 容器中使用 CORS，以降低跨域 HTTP 请求所带来的风险。

　　针对于JAVA开发而言，为了更好的做业务分层，经常会将前后端代码分离开来，发布在不同的服务器上，此时，便会遇到跨域的问题。

　　跨域有很多种解决方案，如果你在使用SpringMVC来开发服务器的话，这个文章会对你有所帮助。它定义了一个Filter来实现跨域请求的问题，实现从不同的服务器上获取HTTP请求资源。

代码示例如下：

## 1. 添加一个JAR包，来实现CORS功能：

gradle: 'com.thetransactioncompany:cors-filter:2.5'

## 2. 在项目的web.xml文件下，添加一个Filter标签：

<!--CORS 跨域资源访问-->

    <filter>

        <filter-name>CORS</filter-name>

        <filter-class>com.thetransactioncompany.cors.CORSFilter</filter-class>

        <init-param>

            <param-name>cors.allowGenericHttpRequests</param-name>

            <param-value>true</param-value>

        </init-param>

        <init-param>

            <param-name>cors.allowOrigin</param-name>

            <param-value>*</param-value>

        </init-param>

        <init-param>

            <param-name>cors.allowSubdomains</param-name>

            <param-value>false</param-value>

        </init-param>

        <init-param>

            <param-name>cors.supportedMethods</param-name>

            <param-value>GET, HEAD, POST, OPTIONS</param-value>

        </init-param>

        <init-param>

            <param-name>cors.supportedHeaders</param-name>

            <param-value>*</param-value>

        </init-param>

        <init-param>

            <param-name>cors.exposedHeaders</param-name>

            <param-value>X-Test-1, X-Test-2</param-value>

        </init-param>

        <init-param>

            <param-name>cors.supportsCredentials</param-name>

            <param-value>true</param-value>

        </init-param>

        <init-param>

            <param-name>cors.maxAge</param-name>

            <param-value>3600</param-value>

        </init-param>

    </filter>

    <filter-mapping>

        <filter-name>CORS</filter-name>

        <url-pattern>/*</url-pattern>

    </filter-mapping>

## 3. 重启你的服务，就可以实现跨域请求了。

相关文章