SpringBoot服务器端解决跨域问题

2024-10-09 16:31:24

本文导航

SpringBoot解决跨域问题的两种方案：

1、通过给方法或者类加注解的形式，@CrossOrigin。

2、继承接口，重写addCorsMappings方法。

第一种方式：

@RestController
@CrossOrigin("http://localhost:8081")
public class BaseController {

 @GetMapping("/hello")
 public String testGet(){

  return "get";
 }

 @PutMapping("/doPut")
 public String testPut(){
  return "put";
 }
}

指定请求来源，可以写成“*”，表示接收所有来源的请求。

第二种方式：

@Configuration
public class WebMvcConfig implements WebMvcConfigurer {

 @Override
 public void addCorsMappings(CorsRegistry registry) {
  registry.addMapping("/**").allowedOrigins("http://localhost:8081")
    .allowedHeaders("*")
    .allowedMethods("*")
    .maxAge(30*1000);
 }
}

allowOrigins也可以写成allowedOrigins(" * ")，表示接收所有来源的请求。

注意点：

1、路径来源的写法问题

如果后台指定路径来源为：http://localhost:8081

那么在浏览器里访问前端页面的时候，必须用 http://localhost:8081，不可以写成127.0.0.1或者本机ip地址。否则还是会报跨域错误。测试如下

后台设置：

 @Override
 public void addCorsMappings(CorsRegistry registry) {
  registry.addMapping("/**").allowedOrigins("http://localhost:8081")
    .allowedHeaders("*")
    .allowedMethods("*")
    .maxAge(30*1000);
 }

前端请求：

<script>
    doGet = function () {
        $.get('http://localhost:8080/hello', function (msg) {
            $("#app").html(msg);
        });
    }
 
    doPut = function () {
        $.ajax({
            type:'put',
            url:'http://localhost:8080/doPut',
            success:function (msg) {
                $("#app").html(msg);
            }
        })
    }
</script>

启动服务，浏览器里访问：

http://localhost:8081/index.html

正常返回结果

浏览器里访问：

http://127.0.0.1:8081/index.html

报跨域错误如下：

所以说，浏览器访问路径需要与后台allowOrigin里设置的参数一致。

那如果代码里的访问路径可以不一样吗，比如：

 doGet = function () {
  $.get('http://127.0.0.1:8080/hello', function (msg) { //本机ip地址
   $("#app").html(msg);
  });
 }

 doPut = function () {
  $.ajax({
   type:'put',
   url:'http://192.168.1.26:8080/doPut',
   success:function (msg) {
    $("#app").html(msg);
   }
  })
 }

经过测试，是可以的，只要浏览器里访问页面的路径写法与后台保持一致就可以了。

2、携带Cookie

有时候，前端调用后端接口的时候，必须要携带cookie（比如后端用session认证），这个时候，就不能简单的使用allowOrigins("*")了，必须要指定具体的ip地址，否则也会报错。

以上就是SpringBoot服务器端解决跨域问题的详细内容，更多关于SpringBoot 解决跨域的资料请关注我们其它相关文章！

详解springboot和vue前后端分离开发跨域登陆问题

前后端分离开发中,一般都会遇到请求跨域问题.而且一般也会遇到登陆失效问题.今天就以springboot和vue为例来看如何解决上述问题增加过滤器 @WebFilter @Component public class CorsFilter implements Filter { @Override public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException,
解决Vue调用springboot接口403跨域问题

最近在做一个前后端分离的项目, 前端用的是Vue后端使用的是springboot, 在项目整合的时候发现前端调用后端接口报错403跨域请求问题前端跨域请求已解决, 那么问题就出在后端了, 找了一些资料找到了很多种方法, 这里说两个简单粗暴的. 注意:"@CrossOrigin"注解要求jdk1.8及以上版本, SpringMVC 4.2及以上版本 1. 在controller层上添加@Configuration注解, 如果没有效果请制定RequestMapping总的method类型
SpringBoot实现jsonp跨域通信的方法示例

实现jsonp跨域通信实现基于jsonp的跨域通信方案原理浏览器对非同源ajax请求有限制,不允许发送跨域请求目前跨域解决方案有两种 cros配置 jsonp请求 cros为新规范,通过一个head请求询问服务器是否允许跨域,若不允许则被拦截 jsonp则为利用浏览器不限制js脚本的同源性,通过动态创建script请求,服务器传递回一个js函数调用语法,浏览器端按照js函数正常调用回调函数实现思路首先确定服务器端应该如何返回数据一次正确的jsonp请求,服务器端应该返回如下格式数据
SpringBoot框架RESTful接口设置跨域允许

跨域跨域请求是指浏览器脚本文件在发送请求时,脚本所在的服务器和请求的服务器地址不一样.跨域是有浏览器的同源策略造成的,是浏览器对JavaScript施加的安全限制, 同源策略:是指协议.域名.端口都要相同,其中有一个不同都会产生跨域 SpringBoot框架RESTful接口解决跨域此处是有配置文件的方式来解决的 package com.prereadweb.config.cors; import org.springframework.context.annotation.Bean; im
SpringBoot跨域Access-Control-Allow-Origin实现解析

这篇文章主要介绍了SpringBoot跨域Access-Control-Allow-Origin实现解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下跨域(CORS)是指不同域名之间相互访问. 跨域,指的是浏览器不能执行其他网站的脚本,它是由浏览器的同源策略所造成的,是浏览器对于JavaScript所定义的安全限制策略. 只要协议,子域名,主域名,端口号有一项不同,就属于跨域跨域的解决方法前端: 使用jsonp 后端: 实现WebMvcC
SpringBoot使用Jwt处理跨域认证问题的教程详解

在前后端开发时为什么需要用户认证呢?原因是由于HTTP协定是不存储状态的,这意味着当我们透过账号密码验证一个使用者时,当下一个request请求时他就把刚刚的资料忘记了.于是我们的程序就不知道谁是谁了. 所以为了保证系统的安全,就需要验证用户是否处于登陆状态. 一.JWT的组成 JWT由Header.Payload.Signature三部分组成,分别用.分隔. 下面就是一个jwt真实的样子,说白了就是一个字符串,但是里面却存储了很重要的信息. eyJhbGciOiJIUzI1NiJ9.eyJzd
SpringBoot+Vue前后端分离实现请求api跨域问题

前言最近过年在家无聊,刚好有大把时间学习Vue,顺便做了一个增删查改+关键字匹配+分页的小dome,可是使用Vue请求后端提供的Api的时候确发现一个大问题,前后端分离了,但是请求的时候也就必定会有跨域这种问题,那如何解决呢? 前端解决方案思路:由于Vue现在大多数项目但是用脚手架快速搭建的,所以我们可以直接在项目中创建一个vue.config.js的配置文件,然后在里面配置proxy代理来解决,话不多说,直接上代码 module.exports = { devServer: { proxy
Springboot前后端分离项目配置跨域实现过程解析

项目登录流程如下用户进入前端登录界面,输入账号密码等,输入完成之后前端发送请求到后端(拦截器不会拦截登录请求),后端验证账号密码等成功之后生成Token并存储到数据库,数据库中包含该Token过期时间,然后返回生成的Token到前端. 前端收到Token,表示登录成功,把这个Token存储本地.然后跳转到用户中心页面,用户中心页面在ajax的请求头中带上Token,跟随请求用户数据接口一起带到后端. 后端通过拦截器拦截到这个请求,去判断这个Token是否有效,有效就放过去做他该做的事情,无效就
Springboot跨域问题三种解决方案

使用vue+axios+spring boot前后端分离项目时会出现跨域问题解决方式: 一: 全局配置 /** * 就是注册的过程,注册Cors协议的内容. * 如: Cors协议支持哪些请求URL,支持哪些请求类型,请求时处理的超时时长是什么等. */ @Override public void addCorsMappings(CorsRegistry registry) { registry .addMapping("/**")// 所有的当前站点的请求地址,都支持跨域访问. .
springboot+angular4前后端分离跨域问题解决详解

springboot中新增一个过滤器如下: package com.rtpksps.kss.config; import org.springframework.stereotype.Component; import javax.servlet.*; import javax.servlet.http.HttpServletResponse; import java.io.IOException; /** * @author Administrator * @title: OriginFilt

SpringBoot服务器端解决跨域问题

相关推荐

随机推荐