spring boot跨域请求

spring boot跨域请求

什么是跨域

跨域，指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的，是浏览器施加的安全限制。所谓同源是指，域名，协议，端口均相同，只要有一个不同，就是跨域

spring boot跨域问题的解决

1. 直接采用SpringBoot的注解

   Controller层在需要跨域的类或者方法上加上@CrossOrigin注解即可。
   ps：import org.springframework.web.bind.annotation.CrossOrigin;
   

2. 处理跨域请求的Configuration

• 方式一：
  添加跨域的pom依赖

 <dependency>
    <groupId>io.projectreactor</groupId>
    <artifactId>reactor-core</artifactId>
    <version>RELEASE</version>
</dependency>

添加配置类

package com.huiyi.config;

import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.http.HttpHeaders;
import org.springframework.http.HttpMethod;
import org.springframework.http.HttpStatus;
import org.springframework.http.server.reactive.ServerHttpRequest;
import org.springframework.http.server.reactive.ServerHttpResponse;
import org.springframework.web.cors.reactive.CorsUtils;
import org.springframework.web.server.ServerWebExchange;
import org.springframework.web.server.WebFilter;
import org.springframework.web.server.WebFilterChain;
import reactor.core.publisher.Mono;

/**
 * @ClassName: RouteConfiguration
 * @Auther: wh
 * @Date: 2019/12/26 15:01
 * @Description:跨域问题解决
 */

@Configuration
public class RouteConfiguration {
    @Bean
    public WebFilter corsFilter() {
        return (ServerWebExchange ctx, WebFilterChain chain) -> {
            ServerHttpRequest request = ctx.getRequest();
            if (CorsUtils.isCorsRequest(request)) {
                ServerHttpResponse response = ctx.getResponse();
                HttpHeaders headers = response.getHeaders();
                headers.add("Access-Control-Allow-Origin", "*");
                headers.add("Access-Control-Allow-Methods", "POST, GET, PUT, OPTIONS, DELETE, PATCH");
                headers.add("Access-Control-Max-Age", "3600");
                headers.add("Access-Control-Allow-Headers", "Content-Type,Content-Length, Authorization, Accept,X-Requested-With,X-App-Id, X-Token");
                headers.add("Access-Control-Expose-Headers", "Location");
                headers.add("Access-Control-Allow-Credentials", "true");
                if (request.getMethod() == HttpMethod.OPTIONS) {
                    response.setStatusCode(HttpStatus.OK);
                    return Mono.empty();
                }
            }
            return chain.filter(ctx);
        };
    }
}

• 方式二：

package com.huiyi.config;

import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.CorsRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurerAdapter;

/**
 * @ClassName: CorsConfig
 * @Auther: wh
 * @Date: 2019/12/26 15:01
 * @Description:跨域问题解决
 */
 
@Configuration
public class CorsConfig extends WebMvcConfigurerAdapter {
    static final String ORIGINS[] = new String[] { "GET", "POST", "PUT", "DELETE" };
    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**").allowedOrigins("*").allowCredentials(true).allowedMethods(ORIGINS)
                .maxAge(3600);
    }
}

3. 通过过滤器的方式（推荐使用）

package com.huiyi.config;

import org.springframework.stereotype.Component;

import javax.servlet.*;
import javax.servlet.annotation.WebFilter;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;

/**
 * @ClassName: CrossDomainConfig
 * @Auther: wh
 * @Date: 2019/12/26 15:01
 * @Description:跨域问题解决
 */
@Component
@WebFilter(filterName = "loginFilter",urlPatterns = "/*")
public class CrossDomainConfig implements Filter {
    @Override
    public void init(FilterConfig filterConfig) {

    }

    @Override
    public void doFilter(ServletRequest request, ServletResponse response, FilterChain chain) throws IOException, ServletException {
        HttpServletResponse httpServletResponseresponse = (HttpServletResponse) response;
        httpServletResponseresponse.setHeader("Access-Control-Allow-Origin", "*");
        httpServletResponseresponse.setHeader("Access-Control-Allow-Methods", "POST, GET, PUT, OPTIONS, DELETE, PATCH");
        httpServletResponseresponse.setHeader("Access-Control-Max-Age", "3600");
        httpServletResponseresponse.setHeader("Access-Control-Allow-Headers", "Content-Type,Content-Length, Authorization, Accept,X-Requested-With,X-App-Id, X-Token");
        httpServletResponseresponse.setHeader("Access-Control-Expose-Headers", "Location");
        chain.doFilter(request, response);
    }

    @Override
    public void destroy() {

    }
}

前端的话，由于vue项目再开发中自带请求代理 ，使用的是 http-proxy-middleware 这个模块（这个模块相当于是node.js的一个插件），所以可以忽略跨域问题，但是再打包的时候，不会将此模块打包，所有需要借助nginx的反向代理来解决跨域问题。