美文网首页springbootJava后端
springboot 跨域解决方案

springboot 跨域解决方案

作者: 打不开的回忆 | 来源:发表于2018-11-06 15:29 被阅读1次

域:协议 + 域名 + 端口;三者完全相同则为同域,反之有其一不同均为不同域。
跨域请求:当前【发起请求】的域和【请求指向】的域属于不同域时,该次请求称之为跨域请求。
同源限制:浏览器针对跨域请求做出同源限制资源访问,Cookie、LocalStorage 和 IndexDB 无法跨域访问;
DOM元素无法跨域访问;Ajax无法跨域请求。

跨域请求,是浏览器拦截请求了吗?

域名和端口不同时的跨域,并非浏览器拦截发起请求,实际请求可以正常到达指向的资源,也可以正常返回,只是浏览器拦截了返回内容。
协议不同时,例如https发起Ajax跨域请求到http,则部分浏览器(Chrome,Firefox)会直接拦截请求,请求无法到达指向的资源。(待验证html中的标签 资源地址属性是否生效

栗子图
1541484066(1).jpg
未解决的跨域请求
1541485023.jpg

可以看出后台数据已经入库,只是浏览器拦截了返回结果,并不影响后台接口的访问。

解决方案:@CrossOrigin注解

@CrossOrigin注解,作用域可以是方法级别,也可以是类级别,若发生覆盖,已作用域高的为准。

属性 说明
origins 允许的来源列表. 他的值放置在HTTP协议的响应header的Access-Control-Allow-Origin .– * – 意味着所有的源都是被允许的。– 如果未定义,则允许所有来源。
allowedHeaders 实际请求期间可以使用的请求标头列表. 值用于预检的响应header Access-Control-Allow-Headers。– * – 意味着允许客户端请求的所有头文件。– 如果未定义,则允许所有请求的headers。
methods 支持的HTTP请求方法列表。 如果未定义,则使用由RequestMapping注释定义的方法。
exposedHeaders 浏览器允许客户端访问的响应头列表。 在实际响应报头Access-Control-Expose-Headers中设置值。– 如果未定义,则使用空的暴露标题列表。
allowCredentials 它确定浏览器是否应该包含与请求相关的任何cookie。– false – cookies 不应该包括在内。– "" (空字符串) – 意味着未定义.– true – 预响应将包括值设置为true的报头Access-Control-Allow-Credentials。– 如果未定义,则允许所有凭据。
maxAge 预响应的高速缓存持续时间的最大时间(以秒为单位)。 值在标题Access-Control-Max-Age中设置。– 如果未定义, 最大时间设置为1800秒(30分钟).

我们在方法级别上只需要加上
@CrossOrigin(origin="*")再次跨域请求即可正常访问:


1541485023(1).jpg
解决方案:全局配置CorsConfig
package com.spring.jpa.controller;

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;

@Configuration
public class CorsConfig {

  @Bean
  public CorsConfiguration corsConfiguration() {
    CorsConfiguration corsConfiguration = new CorsConfiguration();
    //实际请求中允许携带的首部字段
    corsConfiguration.addAllowedHeader("*");
    //允许那些域跨域访问
    corsConfiguration.addAllowedOrigin("*");
    //允许那些请求方法
    corsConfiguration.addAllowedMethod("*");
    return corsConfiguration;
  }

  @Bean
  public CorsFilter corsFilter(CorsConfiguration corsConfiguration) {
    UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
    source.registerCorsConfiguration("/**", corsConfiguration); // 4
    return new CorsFilter(source);
  }

}
解决方案:自定义Filter
import javax.servlet.*;  
import javax.servlet.http.HttpServletResponse;  
import java.io.IOException;  
   
@Component  
public class CorsFilter implements Filter {  
    public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {  
        //为response填充头部信息,实现跨域正常返回
        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);  
    }  
    public void init(FilterConfig filterConfig) {}  
    public void destroy() {}  
}
解决方案:SpringMVC框架自带配置类
@Configuration
@EnableWebMvc
public class CorsConfiguration extends WebMvcConfigurerAdapter
{
    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
                .allowedMethods("GET", "POST");
    }
}
//或者
@Configuration
public class CorsConfiguration
{
    @Bean
    public WebMvcConfigurer corsConfigurer()
    {
        return new WebMvcConfigurerAdapter() {
            @Override
            public void addCorsMappings(CorsRegistry registry) {
                registry.addMapping("/**");
            }
        };
    }
}
解决方案:SpringSecurity
@EnableWebSecurity
public class WebSecurityConfig extends WebSecurityConfigurerAdapter {
 
    @Override
    protected void configure(HttpSecurity http) throws Exception {
        http.cors().and()
            //other config
    }
 
    @Bean
    CorsConfigurationSource corsConfigurationSource()
    {
        CorsConfiguration configuration = new CorsConfiguration();
        configuration.setAllowedOrigins(Arrays.asList("https://example.com"));
        configuration.setAllowedMethods(Arrays.asList("GET","POST"));
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        source.registerCorsConfiguration("/**", configuration);
        return source;
    }
}
方案都大同小异,可以自行测试,选择适合自己得就好。附上Http协议 Header得简要解析:
  • Access-Control-Allow-Origin

    响应首部中可以携带这个头部表示服务器允许哪些域可以访问该资源,其语法如下:

    Access-Control-Allow-Origin: <origin> | *
    
    

    其中,origin 参数的值指定了允许访问该资源的外域 URI。对于不需要携带身份凭证的请求,服务器可以指定该字段的值为通配符,表示允许来自所有域的请求。

  • Access-Control-Allow-Methods

    该首部字段用于预检请求的响应,指明实际请求所允许使用的HTTP方法。其语法如下:

    Access-Control-Allow-Methods: <method>[, <method>]*
    
    
  • Access-Control-Allow-Headers

    该首部字段用于预检请求的响应。指明了实际请求中允许携带的首部字段。其语法如下:

    Access-Control-Allow-Headers: <field-name>[, <field-name>]*
    
    
  • Access-Control-Max-Age

    该首部字段用于预检请求的响应,指定了预检请求能够被缓存多久,其语法如下:

    Access-Control-Max-Age: <delta-seconds>
    
    
  • Access-Control-Allow-Credentials

    该字段可选。它的值是一个布尔值,表示是否允许发送Cookie。默认情况下,Cookie不包括在CORS请求之中。设为true,即表示服务器明确许可,Cookie可以包含在请求中,一起发给服务器。其语法如下:

    Access-Control-Allow-Credentials: true
    
    

    另外,如果要把 Cookie 发送到服务器,除了服务端要带上Access-Control-Allow-Credentials首部字段外,另一方面请求中也要带上withCredentials属性。

    但是需要注意的是:如果需要在 Ajax 中设置和获取 Cookie,那么Access-Control-Allow-Origin首部字段不能设置为* ,必须设置为具体的 origin 源站。详细可阅读文章CORS 跨域 Cookie 的设置与获取

  • Origin

    该首部字段表明预检请求或实际请求的源站。不管是否为跨域请求,Origin字段总是被发送。其语法如下:

    Origin: <origin>
    
    
  • Access-Control-Request-Method

    该首部字段用于预检请求。其作用是,将实际请求所使用的 HTTP 方法告诉服务器。其语法如下:

    Access-Control-Request-Method: <method>
    
    
  • Access-Control-Request-Headers

    该首部字段用于预检请求。其作用是,将实际请求所携带的首部字段告诉服务器。其语法如下:

    Access-Control-Request-Headers: <field-name>[, <field-name>]*
    

相关文章

  • 跨域问题

    跨域问题与SpringBoot解决方案 什么是跨域? 定义:浏览器从一个域名的网页取请求另一个域名下的东西。通俗点...

  • Web前后端跨域问题处理

    跨域问题有前台跨域(iframe间)和后台跨域。 前台跨域的解决方案可以采用跨域文档通讯(Cross domain...

  • 跨域问题,解决方案

    跨域问题,解决方案 - Nginx反向代理跨域问题,解决方案 - CORS方案此为原作者的链接:跨域问题,解决之道

  • springboot 在整合shiro后,跨域就失效了。

    原springboot 解决跨域问题 使用 tomcat 中的 Filter的方式解决跨域

  • 前端如何解决常见跨域问题

    跨域解决方案 1、 通过jsonp跨域 2、 document.domain + iframe跨域 3、 loca...

  • 开发环境跨域和生产环境跨域

    开发环境跨域 前后端分离,IP地址不同,请求数据必然导致跨域问题;解决方案:proxy设置 生产环境跨域 解决方案...

  • 浏览器跨域及其解决方案

    title: 浏览器跨域及其解决方案author: Maydate: 20220428 什么是跨域跨域的表现解决跨...

  • 跨域解决方案

    跨域解决方案 跨域解决方案有:设置document.domain,使用带src标签,JSONP,navigatio...

  • 跨域

    参考资料 HTTP访问控制(CORS)跨域解决方案跨域详解

  • springboot 跨域解决方案

    域:协议 + 域名 + 端口;三者完全相同则为同域,反之有其一不同均为不同域。跨域请求:当前【发起请求】的域和【请...

网友评论

    本文标题:springboot 跨域解决方案

    本文链接:https://www.haomeiwen.com/subject/khquxqtx.html