这些天做一个网站,使用动静分离的方式,前端使用vue.js开发,后台用的java写的接口,就遇到了跨域的问题。
以前只是在移动端app上集成一个html页面而已,所以以前解决跨域的问题都是使用jsonp方式,但是现在要开发一个网站,会有上传文件的业务,由于jsonp只支持get请求,就无法满足了,想到了用CORS的方式,在网上查了下资料,发现好多都不太对,下面记录一下,很简单。
1、只需要两个jar包,一个是java-property-utils,另一个是cors-filter 这两个jar包,其中java-property-utils可以在阿里的maven仓库中找到,cors-filter这个jar包阿里仓库中找不到,需要自己下载然后放到项目中。
2、pom.xml中添加配置,是为了配置maven中导入java-property-utils 这个jar包
<dependency>
<groupId>com.thetransactioncompanygroupId>
<artifactId>java-property-utilsartifactId>
<version>1.9.1version>
dependency>
3、手动下载并导入cors-filter这个jar包,我这里的是cors-filter-1.7.1.jar版本
4、web.xml中的配置
<filter>
<description>跨域过滤器description>
<filter-name>CORSfilter-name>
<filter-class>com.thetransactioncompany.cors.CORSFilterfilter-class>
<init-param>
<param-name>cors.allowOriginparam-name>
<param-value>*param-value>
init-param>
<init-param>
<param-name>cors.supportedMethodsparam-name>
<param-value>GET, POST, HEAD, PUT, DELETEparam-value>
init-param>
<init-param>
<param-name>cors.supportedHeadersparam-name>
<param-value>Accept, Origin, X-Requested-With, Content-Type, Last-Modifiedparam-value>
init-param>
<init-param>
<param-name>cors.exposedHeadersparam-name>
<param-value>Set-Cookieparam-value>
init-param>
<init-param>
<param-name>cors.supportsCredentialsparam-name>
<param-value>trueparam-value>
init-param>
filter>
<filter-mapping>
<filter-name>CORSfilter-name>
<url-pattern>/*url-pattern>
filter-mapping>
其中
<param-name>cors.allowOriginparam-name>
<param-value>*param-value>
可以配置允许跨域的域名,*表示所有域名都允许。