Java服务端如何解决跨域问题 CORS请求头方式
弱水提沧 人气:1Java服务端解决跨域 CORS请求头
最近与前端进行本地联调时,发生了跨域的问题,无法访问我的服务端地址,使用了以下的方式进行了解决。
解决方法
通过fileter中写入ACCESS-Control-Allow的头信息,进行跨域访问,代码如下:
public class CrossDomainFilter implements Filter{ @Override public void destroy() { // TODO Auto-generated method stub } @Override public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException { //设置跨域请求 HttpServletResponse response = (HttpServletResponse) res; //此处ip地址为需要访问服务器的ip及端口号 response.setHeader("Access-Control-Allow-Origin", "http://192.168.1.1:8080"); response.setHeader("Access-Control-Allow-Credentials", "true"); response.setHeader("Access-Control-Allow-Methods", "GET, HEAD, POST, PUT, DELETE, TRACE, OPTIONS, PATCH"); response.setHeader("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type,Token,Accept, Connection, User-Agent, Cookie"); response.setHeader("Access-Control-Max-Age", "3628800"); System.out.println("设置跨域请求"); chain.doFilter(req, response); } @Override public void init(FilterConfig filterConfig) throws ServletException { // TODO Auto-generated method stub } }
其中
- "
Access-Control-Allow-Origin
"表示的是访问服务端的ip地址及端口号,也可以设置为*表示所有域都可以通过; - "
Access-Control-Allow-Credentials
"表示的是跨域的ajax中可以携带cookie,此时第一项设置不能为*,需指定域名; - "
Access-Control-Allow-Methods
"表示的是允许跨域的请求方法; - "
Access-Control-Allow-Headers
"表示的是允许跨域请求包含content-type头; - "
Access-Control-Allow-Max-Age
"表示的是在3628800秒内,不需要再发送预检验请求,可以缓存该结果,一般默认。
写完filter别忘记配置web.xml,其代码如下:
<!-- 跨域设置 --> <filter> <filter-name>crossFilter</filter-name> <filter-class>com.chinamobile.bcop.console.security.filter.CrossDomainFilter</filter-class> </filter> <filter-mapping> <filter-name>crossFilter</filter-name> <url-pattern>/*</url-pattern> </filter-mapping>
在调试的过程中,如果出现错误,可以看看自己的Access-Control-Allow-Headers是否有加全,通过以上方法就可以实现跨域了。
CORS解决跨域的几种实现方式
一、什么是跨域
当一个请求的url的协议、域名、端口任意一个与当前页面的url不同即为跨域
a页面想获取b页面的资源,a与b页面的协议、域名或端口号不同,进行的访问行为都是跨域,由于浏览器的同源策略,会限制跨域请求资源。
当前页url | 请求url | 是否为跨域 |
---|---|---|
http://test.com/ | http://test.com/show.html | 否(同源) |
http://www.test.com/ | https://www.test.com/index.html | 跨域 协议不同 http/https |
http://www.test.com/ | http://www.baidu.com/ | 跨域 主域名不同(test/baidu) |
http://www.test.com:8080/ | http://www.test.com:7001/ | 跨域 端口号不同(8080/7001) |
二、同源策略
同源策略(Same origin policy)是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,则浏览器的正常功能可能都会受到影响。可以说Web是构建在同源策略基础之上的,浏览器只是针对同源策略的一种实现。
同源政策由 Netscape 公司引入浏览器。目前,所有浏览器都实行这个政策。最初,它的含义是指,A网页设置的 Cookie,B网页不能打开,除非这两个网页"同源"。所谓"同源"指的是"三个相同":
- 协议相同
- 域名相同
- 端口相同
同源策略确保一个应用中的资源只能被本应用的资源访问。
非同源限制
- cookie、localStorage、indexDB无法读取
- DOM和js对象无法获取
- 无法发送Ajax请求
三、跨域的解决办法
浏览器的同源策略,帮我们解决了很多安全性的问题
与此同时,同源策略带来的问题,A页面想要获取B页面的资源怎么办?
CORS
- CORS(Cross-Origin Resource Sharing)是一个W3C标准,全称“跨域资源共享”
整个CORS通信过程,都是浏览器自动完成,不需要用户参与。对于开发者来说,CORS通信与同源的AJAX通信没有差别,代码完全一样。浏览器一旦发现AJAX请求跨源,就会自动添加一些附加的头信息,有时还会多出一次附加的请求,但用户不会有感觉
它允许浏览器向跨域服务器,发出XMLHttpRequest请求,从而解决Ajax只能同源使用的限制
3.1、两种请求
浏览器将cors请求分为两类:简单请求和非简单请求
只要同时满足以下条件,就属于简单请求
1、请求方法为以下三种之一
HEAD
GET
POST
2、HTTP的头信息不超出以下几种字段
Accept
Accept-Language
Content-Language
Last-Event-ID
Content-type 只限于三个值application/x-www-form-urlencoded、multipart/form-data、text/plain
凡是不满足以上条件,就属于非简单请求
3.1.1、简单请求
对于简单请求,浏览器直接发送请求。在请求头信息中,添加一个Origin字段,Origin字段用来说明,本次请求来自哪个源(协议 + 域名 + 端口)。服务器根据这个值,决定是否同意这次请求
Origin: http://localhost:8083
服务端处理
添加相应响应头信息
Access-Control-Allow-Origin
: http://localhost:8083 该字段是必须的。它的值要么是请求时Origin字段的值,要么是一个*,表示接受任意域名的请求Access-Control-Expose-Headers
该字段可选。CORS请求时,XMLHttpRequest对象的getResponseHeader()方法只能拿到6个基本字段:Cache-Control、Content-Language、Content-Type、Expires、Last-Modified、Pragma。如果想拿到其他字段,就必须在Access-Control-Expose-Headers里面指定。上面的例子指定,getResponseHeader('FooBar')可以返回FooBar字段的值Access-Control-Allow-Credentials
: true该字段可选。它的值是一个布尔值,表示是否允许发送Cookie。默认情况下,Cookie不包括在CORS请求之中。设为true,即表示服务器明确许可,Cookie可以包含在请求中,一起发给服务器。这个值也只能设为true,如果服务器不要浏览器发送Cookie,删除该字段即可
CORS请求默认不发送Cookie数据,如果要传送cookie数据,则需在前端Ajax请求中打开withCredentials属性
需要注意的是,如果要发送Cookie,Access-Control-Allow-Origin就不能设为星号,必须指定明确的、与请求网页一致的域名
var xhr = new XMLHttpRequest(); xhr.withCredentials = true;
3.1.2、非简单请求
预检请求
- 非简单请求是那种对服务器有特殊要求的请求,比如请求方法是PUT或DELETE,或者Content-Type字段的类型是application/json。
- 非简单请求的CORS请求,会在正式通信之前,增加一次HTTP查询请求,称为"预检"请求(preflight)
- 浏览器先询问服务器,当前网页所在的域名是否在服务器的许可名单之中,以及可以使用哪些HTTP动词和头信息字段。只有得到肯定答复,浏览器才会发出正式的XMLHttpRequest请求,否则就报错。
服务端处理
Access-Control-Allow-Methods
该字段必需,它的值是逗号分隔的一个字符串,表明服务器支持的所有跨域请求的方法。注意,返回的是所有支持的方法,而不单是浏览器请求的那个方法。这是为了避免多次"预检"请求。Access-Control-Allow-Headers
如果浏览器请求包括Access-Control-Request-Headers字段,则Access-Control-Allow-Headers字段是必需的。它也是一个逗号分隔的字符串,表明服务器支持的所有头信息字段,不限于浏览器在"预检"中请求的字段。Access-Control-Allow-Credentials
该字段与简单请求时的含义相同。Access-Control-Max-Age:1728000
该字段可选,用来指定本次预检请求的有效期,单位为秒。上面结果中,有效期是20天(1728000秒),即允许缓存该条回应1728000秒(即20天),在此期间,不用发出另一条预检请求。
3.2、CORS常用解决跨域的方法
前端发送Ajax请求
$("#test").click(function(){ $.ajax({ url : "http://localhost:8084/show.cors", type : "GET", success : function(result){ // alert(result); console.log(result) } }) })
3.2.1、HttpServletResponse添加头信息
@RestController public class CorsController { @RequestMapping(value = "/look.cors") public String look(HttpServletResponse response){ response.addHeader("Access-Control-Allow-Origin","http://localhost:8083"); //response.addHeader("Access-Control-Allow-Credentials","true"); return "hello cors"; } }
3.2.2、使用Spring注解@CrossOrigin
@RestController public class CorsController2 { @RequestMapping(value = "/show.cors") @CrossOrigin(origins = "http://localhost:8083") /* @CrossOrigin 也可配置在类上 属性: methods 表明服务器支持的跨域请求的方法 maxAge 预检的有效期 */ public String show(){ return "hello cors"; } }
3.2.3、通过配置类解决跨域
使用HttpServletResponse对象或注解方式,需要在每个需要跨域的方法上都加上相应的注解或参数,我们想让所有的controller都添加跨域功能,我们可以通过实现WebMvcConfigurer接口来自定义跨域配置
WebMvcConfigurer是一个接口,提供很多自定义的拦截器,例如跨域设置、类型转化器等springMVC的配置
@Configuration public class CorsConfig implements WebMvcConfigurer { /** * **addMapping**:配置可以被跨域的路径,可以任意配置,可以具体到直接请求路径。 * * **allowedMethods**:允许所有的请求方法访问该跨域资源服务器,如:POST、GET、PUT、DELETE等。 * * **allowedOrigins**:允许所有的请求域名访问我们的跨域资源,可以固定单条或者多条内容,如:”[http://www.aaa.com](http://www.aaa.com/)“,只有该域名可以访问我们的跨域资源。 * * **allowedHeaders**:允许所有的请求header访问,可以自定义设置任意请求头信息。 * @param registry */ @Override public void addCorsMappings(CorsRegistry registry) { registry.addMapping("/*.cors") .allowedOrigins("http://localhost:8083") .allowedMethods("POST","GET") .maxAge(1000); } }
以上为个人经验,希望能给大家一个参考,也希望大家多多支持。
加载全部内容