SpringBoot跨域Jsonp和Cors的方法

有一次我的项目中采用了前后端分离的模式，引起了跨域问题，本文将介绍我所采用的跨域解决方法。

首先要了解产生跨域的本质，也就是同源策略的限制，源是指域名、端口号、协议，有一者不相同将被浏览器拒绝接受响应信息，（请求可以发送出去，但是浏览器不接受响应）。

解决方法：

1. jsonp

jsonp的原理的 src="" 属性不受同源策略的限制，动态创建一个callback回调函数，服务器调用回调函数把数据放进去，具体的细节打算以后做一个专门讲解。

这里给一个模版:

$.ajax({
     type: "get",        //jsonp只能使用get
     async: false,
     url: ""
     dataType: "jsonp",
     jsonp: "callback",
     jsonpCallback:"message",    //注意这里给回调函数起的名字
       success: function(json){

      }
    })

如果这里你的回调函数起名为message，那么你在后端返回json的时候，也要注意在最外面包一层message{}。

这里jsonp的确定也可以明显的看出，只支持get请求，原因就是因为通过src=“”发送请求，所以可以知道是url传参。

那么jsonp的好处是什么呢，兼容性，几乎所有浏览器都支持（包括一些版本比较老的），不需要XMLHttpRequest或ActiveX的支持。

2. cors

又称跨域访问，浏览器将cors请求分为简单请求和非简单请求，因为本文主要讲解具体的方法，所以关于细节部分有兴趣可以去看其他博客或者我以后再做一篇具体的讲解（和jsonp一起）。在springboot中，官方已经提供了支持。直接贴代码：

方式一：全局定义

@Configuration
public class CorsConfig implements WebMvcConfigurer {
  private CorsConfiguration buildConfig() {
    CorsConfiguration corsConfiguration = new CorsConfiguration();
    List<String> list = new ArrayList<>();
    list.add("*");
    corsConfiguration.setAllowedOrigins(list);
    /*
    // 请求常用的三种配置，*代表允许所有，当时你也可以自定义属性
    （比如header只能带什么，只能是post方式等等）
    */
    corsConfiguration.addAllowedOrigin("*");  //支持的源
    corsConfiguration.addAllowedHeader("*");  //header限制
    corsConfiguration.addAllowedMethod("*");  //支持方法
    return corsConfiguration;
  }
  @Bean
  public CorsFilter corsFilter() {
    UrlBasedCorsConfigurationSource source
      = new UrlBasedCorsConfigurationSource();
    source.registerCorsConfiguration("/**", buildConfig());
    return new CorsFilter(source);
  }
}

方式二：局部定义

@CrossOrigin(origins = "*",allowCredentials="true",allowedHeaders = "",methods = {})

直接在需要跨域的方法上添加注解，不过我没试过，有兴趣或者有这种方式需求的朋友可以尝试一下。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。

赞 (0)

相关推荐

  • springboot+jsonp解决前端跨域问题小结

    springboot+jsonp解决前端跨域问题小结

    现在咱们一起来讨论浏览器跨域请求数据的相关问题.说这样可能不是很标准,因为拒绝跨域请求数据并不是浏览器所独有的,之所以会出现跨域请求不了数据,是因为浏览器基本都实现了一个叫"同源策略"的安全规范.该规范具体是什么呢?我们在MDN上找到了一份资料,地址如下: 浏览器同源策略讲解 总的来说,当A网址和B网址在 协议 . 端口 . 域名 方面存在不同时,浏览器就会启动同源策略,拒绝A.B服务器之间进行数据请求. 说了同源策略,纸上得来终觉浅,绝知此事要躬行,到底同源策略是怎么体现的呢?下面我

  • Spring boot 总结之跨域处理cors的方法

    背景 现在做的很多项目都是前后端分离的,这就引出一个很常见的问题,我们的页面和接口是在不同域名下的,当我们通过ajax访问后端接口的时候就会出现跨域问题,这种问题我们怎么解决呢?一般来说就是cors和jsonp这两种方案.Spring简化了cors的配置,接下来我们来看一下它提供的cors. 跨域问题描述 Web开发经常会遇到跨域问题,解决方案有:jsonp,iframe,CORS等等. CORS 与 JSONP 相比: 1. JSONP 只能实现 GET 请求,而 CORS 支持所有类型的 H

  • spring boot配合前端实现跨域请求访问

    一.方法: 服务端设置Respone Header头中Access-Control-Allow-Origin 配合前台使用jsonp 继承WebMvcConfigurerAdapter 添加配置类 二.实例: 1.前端:因为我们用了前后端分离,前端用node服务器,node服务器再用了ajax反向代理请求到我的spring boot 服务器.其中node服务器也用了ajax发出请求所以也存在跨域的问题.具体代码: app.all(apiRoot + '/*', proxy('127.0.0.1:

  • 详解SpringBoot多跨域请求的支持（JSONP）

    详解SpringBoot多跨域请求的支持（JSONP）

    在我们做项目的过程中,有可能会遇到跨域请求,所以需要我们自己组装支持跨域请求的JSONP数据,而在4.1版本以后的SpringMVC中,为我们提供了一个AbstractJsonpResponseBodyAdvice的类用来支持jsonp的数据(SpringBoot接收解析web请求是依赖于SpringMVC实现的).下面我们就看一下怎么用AbstractJsonpResponseBodyAdvice来支持跨域请求. 使用AbstractJsonpResponseBodyAdvice来支持跨域请求

  • vue+springboot实现项目的CORS跨域请求

    跨域资源共享CORS(Cross-origin Resource Sharing),是W3C的一个标准,允许浏览器向跨源的服务器发起XMLHttpRequest请求,克服ajax请求只能同源使用的限制.关于CORS的详细解读,可参考阮一峰大神的博客:跨域资源共享CORS详解.本文为通过一个小demo对该博客中分析内容的一些验证. 1.springboot+vue项目的构建和启动 细节不在此赘述,任何简单的springboot项目就可以,而前端vue项目只需用axios发ajax请求即可. 我的d

  • SpringBoot解决ajax跨域问题的方法

    SpringBoot解决ajax跨域,供大家参考,具体内容如下 一.第一种方式 1.编写一个支持跨域请求的 Configuration import org.springframework.context.annotation.Configuration; import org.springframework.web.servlet.config.annotation.CorsRegistry; import org.springframework.web.servlet.config.anno

  • Spring boot跨域设置实例详解

    定义:跨域是指从一个域名的网页去请求另一个域名的资源 1.原由 公司内部有多个不同的子域,比如一个是location.company.com ,而应用是放在app.company.com , 这时想从 app.company.com去访问 location.company.com 的资源就属于跨域 本人是springboot菜鸟,但是做测试框架后端需要使用Springboot和前端对接,出现跨域问题,需要设置后端Response的Header.走了不少坑,在这总结一下以备以后使用 2.使用场景

  • 详解springboot设置cors跨域请求的两种方式

    1.第一种: public class CorsFilter extends OncePerRequestFilter { static final String ORIGIN = "Origin"; protected void doFilterInternal( HttpServletRequest request, HttpServletResponse response, FilterChain filterChain) throws ServletException, IOE

  • spring boot ajax跨域的两种方式

    spring boot ajax跨域的两种方式

    前言 java语言在多数时,会作为一个后端语言,为前端的php,node.js等提供API接口.前端通过ajax请求去调用java的API服务.今天以node.js为例,介绍两种跨域方式:CrossOrigin和反向代理.  一.准备工作 pom.xml: <?xml version="1.0" encoding="UTF-8"?> <project xmlns="http://maven.apache.org/POM/4.0.0&quo

  • Spring Boot实现跨域访问实现代码

    当前使用spring版本是4.3.9 import org.springframework.stereotype.Component; import javax.servlet.*; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import java.io.IOException; @Component public class CorsFilter im

  • 浅谈spring-boot 允许接口跨域并实现拦截（CORS）

    本文介绍了spring-boot 允许接口跨域并实现拦截(CORS),分享给大家,也给自己留个笔记 pom.xml(依赖的jar) // 在spring-boot-starter-web的启动器中,已经依赖好了 <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-web</artifactId> </dependen

随机推荐