前言

最近在项目中,由于前后分离,前台项目和后台项目部署的不在一台服务器,就产生了跨域的问题,特此记录下


正文

正常情况下,如果提示:

就可以判断是没有解决跨域的问题了。

在SSM中,我曾经这样解决过:

在springmvc的配置文件中添加如下代码:
<mvc:cors>
<mvc:mapping path="/**"
allowed-origins="*"
allowed-methods="POST, GET, OPTIONS, DELETE, PUT"
allowed-headers="Content-Type, Access-Control-Allow-Headers, Authorization, X-Requested-With"
allow-credentials="true" />
</mvc:cors>

在springboot中,可以如下实现功能:

创建一个配置类,继承 WebMvcConfigurerAdapter,实现跨域映射即可

@Configuration
public class WebAppConfig extends WebMvcConfigurerAdapter {
@Override
public void addCorsMappings(CorsRegistry registry) {
registry.addMapping("/**");
}
}

到此已经可以解决跨域问题了!


需要注意的是

在springboot中,如果想要更加详细的控制跨域的请求的话有也可以对上面的方法进行细化控制,如下:

@Configuration
public class WebAppConfig extends WebMvcConfigurerAdapter {
@Override
public void addCorsMappings(CorsRegistry registry) {
registry.addMapping("/**")        //可以跨域访问的路径
.allowedOrigins("http://192.168.1.97") //允许访问的ip
.allowedMethods("GET", "POST")      //允许的方法
.allowCredentials(false).maxAge(3600); //用户证书验证,最大过期时间
}
}

当然,如果你需要更加详细的控制跨域问题,那么可以在每个controller上进行设置并控制跨域(需要特别注意的是:必须指定方法,也就是methods ={RequestMethod.POST,RequestMethod.GET})

@Api(value = "user", tags = "用户管理")
@RestController("managerUser")
@RequestMapping(value = "user")
@CrossOrigin(origins = "http://192.168.1.97:8080", maxAge = 3600,methods = {RequestMethod.POST,RequestMethod.GET})
public class UserController {}

如果你需要更加详细的跨域控制,可以在方法上进行设置

@RequestMapping(value = "AuditedUnitManager",method = RequestMethod.POST)
@CrossOrigin(origins = "http://192.168.1.97:8080", maxAge = 3600)
public Map<String, Object> managerLogin() {}

2018-07-30更新:

目前项目跨域问题已经解决,但是前后分离的项目会导致一种情况:跨域会引起项目session的丢失,目前正在解决这个问题。晚点更新解决方案。

关于解决Springboot跨域请求的方法的更多相关文章

  1. 两种解决springboot 跨域问题的方法示例

    两种解决springboot 跨域问题的方法示例,哪种方法看情况而定,自己选择.社会Boolean哥,人狠话不多,直接上代码. 第一种实现方式:       此种方式做全局配置,用起来更方便,但是无法 ...

  2. 如何解决ajax跨域请求?

    1.什么是跨域? a.域名不同 b.域名相同,端口不同 注:只有域名相同,端口相同时,才可以访问数据 可以使用jsonp解决ajax跨域请求的问题. 2.什么是jsonp? Jsonp其实就是一个跨域 ...

  3. Nodejs解决所有跨域请求

    Nodejs解决所有跨域请求 app.use(function(req, res, next) { res.setHeader('Access-Control-Allow-Origin', '*'); ...

  4. 本地主机作服务器解决AJAX跨域请求访问数据的方法

    近几天学到ajax,想测试一下ajax样例,由于之前在阿里租用的服务器过期了,于是想着让本地主机既做服务器又做客户端,只是简单地测试,应该还行. 于是,下载了xampp,下载网址http://www. ...

  5. springboot跨域请求

      首页 所有文章 资讯 Web 架构 基础技术 书籍 教程 Java小组 工具资源 SpringBoot | 番外:使用小技巧合集 2018/09/17 | 分类: 基础技术 | 0 条评论 | 标 ...

  6. Fetch+SpringBoot跨域请求设置

    两种方法从SpringBoot的方向解决跨域问题 今天搭建博客的时候,尝试性的传递数据,发现浏览器报了这个错误 -blocked by CORS policy: No 'Access-Control- ...

  7. 点击<a>页面跳转解决办法/跨域请求,JSONP

    有些时候做的东西刚好要用到链接,但又不需要去链接,只需要对onclick事件进行处理,但它却这样子写 <a href="#" onclick="gettext()& ...

  8. JQuery - Ajax和Tomcat跨域请求问题解决方法!

    在JQuery里面使用Ajax和Tomcat服务器之间进行数据交互,遇到了跨域请求问题,无法成功得到想要的数据! 错误信息部分截图: 通过错误信息判断知道已经发生在Ajax跨域请求问题了! 当前Tom ...

  9. Ajax跨域请求action方法,无法传递及接收cookie信息(应用于系统登录认证及退出)解决方案

    最近的项目中涉及到了应用ajax请求后台系统登录,身份认证失败,经过不断的调试终于找到解决方案. 应用场景: 项目测试环境:前端应用HTML,js,jQuery ajax请求,部署在Apache服务器 ...

随机推荐

  1. BZOJ4767 两双手

    本文版权归ljh2000和博客园共有,欢迎转载,但须保留此声明,并给出原文链接,谢谢合作. 本文作者:ljh2000 作者博客:http://www.cnblogs.com/ljh2000-jump/ ...

  2. BOM(Browser Object Model) 浏览器对象模型

    JavaScript 实现是由 3 个部分组成:核心(ECMAScript),文档对象模型(DOM),浏览器对象模型(BOM) BOM(Browser Object Model) 浏览器对象模型BOM ...

  3. HighCharts常用设置

    1. X轴文字斜着放,在xAxis里设置 xAxis: { labels: { rotation: -90 //竖直放 rotation: -45 //45度倾斜 } } 2. 柱形图柱形的宽度和边框 ...

  4. 1-15-2-RAID1 企业级RAID磁盘阵列的搭建(RAID1、RAID5、RAID10)

    大纲: 1.创建RAID1 2.创建RAID5 3.创建RAID10 =============================== 1.创建RAID1 RAID1原理:需要两块或以上磁盘,可添加热备 ...

  5. poj-3461-kmp模板题。。。

    Oulipo Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 46290   Accepted: 18452 Descript ...

  6. Gruntjs提高生产力(二)

    摆脱混乱的html文件中开发,拥有development与product模式是我们梦寐以求的. 我买的需求是: 1.产出一定格式的目录结构,以供日常开发使用,脚手架功能. 2.在开发模式环境中我们按照 ...

  7. ana3+opencv+TensorFlow+NVIDIAGPU 安装

    http://blog.csdn.net/qq_30611601/article/details/79067982 这个博客写的挺完整的 当你发现你的anna下载的贼鸡儿的慢,你就需要使用清华的镜像网 ...

  8. 【Raspberry Pi】USB无线网卡自动连接

    Raspberry Pi 使用USB无线网卡的时候不会因为路由重启而掉线. #!/bin/bash while true ; do if ifconfig wlan0 | grep -q " ...

  9. 010PHP基础知识——运算符(三)

    <?php /** * 位运算符: * 1:&按位与:左右两边的数,同位都为1,返回是1,否则返回是0 */ /*$a = 5; $b = 6; $a = decbin($a);//10 ...

  10. JS中apply与call的用法

    JavaScript中有一个call和apply方法,其作用基本相同,但也有略微的区别. 先来看看JS手册中对call的解释: call 方法调用一个对象的一个方法,以另一个对象替换当前对象. cal ...