java后端解决跨域问题
##首先我门要知道什么是跨域:
跨域是指 不同域名之间相互访问。跨域,指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的,是浏览器对JavaScript施加的安全限制。
也就是如果在A网站中,我们希望使用Ajax来获得B网站中的特定内容
如果A网站与B网站不在同一个域中,那么就出现了跨域访问问题。
##什么是同一个域?
同一协议,同一ip,同一端口,三同中有一不同就产生了跨域。
#前端解决跨域:
前边也说了,跨域是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的,是浏览器对JavaScript施加的安全限制。
解决:
所以搞一个node 服务器做代理,发出请求到node 服务器,node服务器转发到后端就可以绕过跨域问题。
1、后端解决跨域问题: 后端解决就比较简单了。例如我用的springboot,只用在Controller类上添加一个“@CrossOrigin“注解就可以实现对当前controller 的跨域 访问了,当然这个标签也可以加到方法上。
@RequestMapping(value = "/users")
@RestController
@CrossOrigin
public class UserController {
@Autowired
private UserService userService;
@RequestMapping(method = RequestMethod.POST)
@CrossOrigin
public User create(@RequestBody @Validated User user) {
return userService.create(user);
}
}
#相关知识:
CSRF是什么?
CSRF(Cross-site request forgery),中文名称:跨站请求伪造,也被称为:one click attack/session riding,缩写为:CSRF/XSRF。
2、 新建跨域配置文件如下即可
/**
* @author yyb
*/
@Configuration
public class CorsConfiguration {
@Bean
public WebMvcConfigurer corsConfigurer() {
return new WebMvcConfigurer() {
@Override
public void addCorsMappings(CorsRegistry registry) {
registry.addMapping("/**")
.allowCredentials(false)
.allowedMethods("POST", "GET", "PUT", "OPTIONS", "DELETE")
.allowedOrigins("*");
}
};
}
}
3、使用过滤器
允许整个项目跨域访问,可通过filter来进行过虑:
public class SimpleCORSFilter implements Filter{
@Override
public void destroy() {
}
@Override
public void doFilter(ServletRequest req, ServletResponse res,
FilterChain chain) throws IOException, ServletException {
HttpServletResponse response = (HttpServletResponse) res;
response.setHeader("Access-Control-Allow-Origin", "*");
response.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE");
response.setHeader("Access-Control-Max-Age", "3600");
response.setHeader("Access-Control-Allow-Headers", "x-requested-with");
chain.doFilter(req, res);
}
@Override
public void init(FilterConfig arg0) throws ServletException {
}
}
在web.xml中需要添加如下配置:
<filter>
<filter-name>cors</filter-name>
<filter-class>com.ssm.web.filter.SimpleCORSFilter</filter-class>
</filter>
<filter-mapping>
<filter-name>cors</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
</filter>
为单个方法提供跨域访问,直接添加请求头:
response.setHeader("Access-Control-Allow-Origin", "*");
response.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE");
response.setHeader("Access-Control-Max-Age", "3600");
response.setHeader("Access-Control-Allow-Headers", "x-requested-with");
4、后台Http请求转发
使用HttpClinet转发进行转发(简单的例子 不推荐使用这种方式)
try {
HttpClient client = HttpClients.createDefault(); //client对象
HttpGet get = new HttpGet("http://localhost:8080/test"); //创建get请求
CloseableHttpResponse response = httpClient.execute(get); //执行get请求
String mes = EntityUtils.toString(response.getEntity()); //将返回体的信息转换为字符串
System.out.println(mes);
} catch (ClientProtocolException e) {
e.printStackTrace();
} catch (IOException e) {
e.printStackTrace();
}
5、后台配置同源Cors (推荐)
在SpringBoot2.0 上的跨域 用以下代码配置 即可完美解决你的前后端跨域请求问题
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.UrlBasedCorsConfigurationSource;
import org.springframework.web.filter.CorsFilter;
/**
* 实现基本的跨域请求
* @author linhongcun
*
*/
@Configuration
public class CorsConfig {
@Bean
public CorsFilter corsFilter() {
final UrlBasedCorsConfigurationSource urlBasedCorsConfigurationSource = new UrlBasedCorsConfigurationSource();
final CorsConfiguration corsConfiguration = new CorsConfiguration();
/*是否允许请求带有验证信息*/
corsConfiguration.setAllowCredentials(true);
/*允许访问的客户端域名*/
corsConfiguration.addAllowedOrigin("*");
/*允许服务端访问的客户端请求头*/
corsConfiguration.addAllowedHeader("*");
/*允许访问的方法名,GET POST等*/
corsConfiguration.addAllowedMethod("*");
urlBasedCorsConfigurationSource.registerCorsConfiguration("/**", corsConfiguration);
return new CorsFilter(urlBasedCorsConfigurationSource);
}
}
6、使用SpringCloud网关
服务网关(zuul)又称路由中心,用来统一访问所有api接口,维护服务。
Spring Cloud Zuul通过与Spring Cloud Eureka的整合,实现了对服务实例的自动化维护,所以在使用服务路由配置的时候,我们不需要向传统路由配置方式那样去指定具体的服务实例地址,只需要通过Ant模式配置文件参数即可
7、使用nginx做转发
现在有两个网站想互相访问接口 在http://a.a.com:81/A
中想访问 http://b.b.com:81/B
那么进行如下配置即可
然后通过访问 www.my.com/A
里面即可访问 www.my.com/B
s
erver {
listen 80;
server_name www.my.com;
location /A {
proxy_pass http://a.a.com:81/A;
index index.html index.htm;
}
location /B {
proxy_pass http://b.b.com:81/B;
index index.html index.htm;
}
}
如果是两个端口想互相访问接口 在http://b.b.com:80/Api
中想访问 http://b.b.com:81/Api
那么进行如下配置即可
使用nginx转发机制就可以完成跨域问题
server {
listen 80;
server_name b.b.com;
location /Api {
proxy_pass http://b.b.com:81/Api;
index index.html index.htm;
}
}