1、对于前后端分离的项目来说,如果前端项目与后端项目部署在两个不同的域下,那么势必会引起跨域问题的出现。

针对跨域问题,我们可能第一个想到的解决方案就是jsonp,并且以前处理跨域问题我基本也是这么处理。

但是jsonp方式也同样有不足,不管是对于前端还是后端来说,写法与我们平常的ajax写法不同,同样后端也需要作出相应的更改。并且,jsonp方式只能通过get请求方式来传递参数,当然也还有其它的不足之处,

jQuery ajax方式以jsonp类型发起跨域请求,其原理跟<script>脚本请求一样,因此使用jsonp时也只能使用GET方式发起跨域请求。跨域请求需要服务端配合,设置callback,才能完成跨域请求。

针对于此,我并没有急着使用jsonp的方式来解决跨域问题,去网上找寻其它方式,也就是本文主要所要讲的,在springboot中通过cors协议解决跨域问题。

2、Cors协议

H5中的新特性:Cross-Origin Resource Sharing(跨域资源共享)。通过它,我们的开发者(主要指后端开发者)可以决定资源是否能被跨域访问。

cors是一个w3c标准,它允许浏览器(目前ie8以下还不能被支持)像我们不同源的服务器发出xmlHttpRequest请求,我们可以继续使用ajax进行请求访问。

具体关于cors协议的文章 ,可以参考http://www.ruanyifeng.com/blog/2016/04/cors.html 这篇文章,讲的相当不错。

3、springboot中解决方案

a. 创建一个filter解决跨域。

@Component
public class SimpleCORSFilter implements Filter {
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, HEAD");
response.setHeader("Access-Control-Max-Age", "3600");
response.setHeader("Access-Control-Allow-Headers", "access-control-allow-origin, authority, content-type, version-info, X-Requested-With"); chain.doFilter(req, res);
}
public void init(FilterConfig filterConfig) {}
public void destroy() {}
}

b. 基于WebMvcConfigurerAdapter配置加入Cors的跨域

import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.CorsRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurerAdapter; @Configuration
public class CorsConfig extends WebMvcConfigurerAdapter { @Override
public void addCorsMappings(CorsRegistry registry) {
registry.addMapping("/**")
.allowedOrigins("*")
.allowCredentials(true)
.allowedMethods("GET", "POST", "DELETE", "PUT")
.maxAge(3600);
} }

如果你想做到更细致也可以使用@CrossOrigin这个注解在controller类中使用。

@CrossOrigin(origins = "http://192.168.1.10:8080", maxAge = 3600)
@RequestMapping("rest_index")
@RestController
public class IndexController{

这样就可以指定该controller中所有方法都能处理来自http:19.168.1.10:8080中的请求。

第一种Filter的方案也支持springmvc。

第二种常用于springboot。

springboot解决跨域问题(Cors)的更多相关文章

  1. SpringBoot解决跨域请求拦截

    前言 同源策略:判断是否是同源的,主要看这三点,协议,ip,端口. 同源策略就是浏览器出于网站安全性的考虑,限制不同源之间的资源相互访问的一种政策. 比如在域名https://www.baidu.co ...

  2. 解决跨域(CORS)问题

    为什么会有跨域问题 是因为浏览器的同源策略是对ajax请求进行阻拦了,但是不是所有的请求都给做跨域,像是一般的href属性,a标签什么的都不拦截 解决跨域问题的两种方式 JSONP   推荐参考 CO ...

  3. springboot 项目跨域问题 CORS

    package com.example.demo.cors; import org.springframework.context.annotation.Bean; import org.spring ...

  4. Springboot第二篇:与前端fetch通信(附springboot解决跨域方法)

    说到与前端通信,明白人都知道这章肯定会写两部分的东西啦. 关于后台 ①首先回顾前文,上一章环境搭建如图: ②我们在maven.example.controller下添加一个文件,并附上如图代码: ③: ...

  5. springboot解决跨域问题

    在启动类里加入corsFilter import org.springframework.boot.SpringApplication; import org.springframework.boot ...

  6. Springboot 解决跨域请求

    Cors处理 跨域请求 细粒度 直接在controller层上 添加@CrossOrigin注解 @PostMapping("/") @CrossOrigin(value = &q ...

  7. 解决跨域问题(CORS)

    一.改变响应头部 请求代码如下: fetch("http://localhost:8888/young",{ method:"get" }).then(func ...

  8. 解决谷歌浏览器 chrome解决跨域(CORS)问题---chrome插件

    chrome中跨域问题解决方案 插件解决, 插件地址  https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfb ...

  9. springboot解决跨域

    @Configuration public class WebMvcConfiguration implements WebMvcConfigurer { @Bean public CorsFilte ...

随机推荐

  1. idea 找不到classpath 为resource下的xml

    注入时不能自动找到在src/main/resources下的xml. @ContextConfiguration(locations = { "classpath:applicationCo ...

  2. 《深入实践Spring Boot》阅读笔记之一:基础应用开发

    上上篇「1718总结与计划」中提到,18年要对部分项目拆分,进行服务化,并对代码进行重构.公司技术委员会也推荐使用spring boot,之前在各个技术网站中也了解过,它可以大大简化spring配置和 ...

  3. Web微信

    一.源代码地址: https://github.com/HuangAm/Webweixin 二.总结: 1.分析Http请求 - 请求方式:get.post等等 - URL:每个请求的url,固定部分 ...

  4. 初试valgrind内存调试工具

    虽然GDB调试工具功能强大,但对于平时做题调试的使用并不方便,这里尝试学习使用比较简单的valgrind工具 Valgrind是一个提供程序调试及性能分析的工具集.其包含的工具主要有Memcheck, ...

  5. Hive:有表A与表B进行inner join,如果A分组内包含有数据,使用A,否则使用B分组下的数据

    tommyduan_fingerlib 指纹库 栅格小区级别数据tommyduan_mr_grid_cell_result_all 统计 栅格小区级别数据业务:以tommyduan_mr_grid_c ...

  6. Java-Maven(七):Eclipse中Maven依赖、聚合、继承特性

    之前通过学习了解,maven集成到eclipse中的如何创建项目,以及maven命令插件在eclipse中安装后的用法.那么接下来我们将会学习一些maven在项目中的一些特性,及如何使用. Maven ...

  7. scrapy中response.body 与 response.text区别

    scrapy中response.body 与 response.text区别 body http响应正文, byte类型 text 文本形式的http正文,str类型,它是response.body经 ...

  8. node.js使用node-xlsx读写数据

    下面是包含了读写的样例: var xlsx = require('node-xlsx'); var fs = require('fs'); // 读取文件内容 var data = xlsx.pars ...

  9. 解决 Can't Connect to MySQL Server on IPAddress (10061) 的问题

    我的MySQL服务器安装在Ubuntu 14.04.3 LTS操作系统上. 然后我通过局域网内的另一台电脑连不上,但是能ping通. 解决办法是首先找到my.cnf这个文件. 我的文件位置在/etc/ ...

  10. bootstrap——bootstrap-table(1)

    前言: 特地纪念一下,自己参加这份工作刚好满一年.依旧乐在其中 言归正传:之前小接触过bootstrap,只是之后用得少了就生疏了,恰好现在的工作使用到了它,就再拿出来认真研究一下. 过程: 一直以来 ...