时间戳

首页 > 技术文章 > SpringBoot 三种跨域方式梳理

SpringBoot 三种跨域方式梳理

antaia11 2021-08-02 23:13 原文

SpringBoot 三种跨域方式梳理

概念：

  • ​ 域 ：协议 + 域名 / IP + 端口

1.跨域现象

首先制造一个跨域的问题：

cros01/HelloController.java - localhost:8080

package com.zhuantai.cors01.controller;

import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RestController;

/**
 * @author ANTIA1
 * @date 2021/7/8 11:18
 */
@RestController
public class HelloController {
    @GetMapping("/hello")
    public String hello(){
        return "hello cors";
    }
}

cros02/01.html - localhost:8081

<!DOCTYPE html>
<html lang="en">
<head>
    
    <title>Title</title>
  <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
</head>
<body>
<input type="button" onclick="getData()" value="get">
<script>
  function getData(){
    $.get("http://localhost:8080/hello",function (msg){
      alert(msg);
    })
  }
</script>
</body>
</html>

image-20210708112858245

Access to XMLHttpRequest at 'http://localhost:8080/hello' from origin 'http://localhost:8081' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

2.三种解决方案

（1）@CrossOrigin()

package com.zhuantai.cors01.controller;

import org.springframework.web.bind.annotation.CrossOrigin;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RestController;

/**
 * @author ANTIA1
 * @date 2021/7/8 11:18
 */
@RestController
//@CrossOrigin("http://localhost:8081",maxAge = 1800) 可以放在单独的方法上，也可以标识整个Controller
public class HelloController {

    @CrossOrigin("http://localhost:8081") //标识允许8081来访问此接口
    @GetMapping("/hello")
    public String hello(){
        return "hello cors";
    }
}

（2）实现 WebMvcConfigurer

package com.zhuantai.cors01.config;

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

/**
 * @author ANTIA1
 * @date 2021/7/8 11:38
 */
@Configuration
public class WebMvcConfig implements WebMvcConfigurer {
    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
                .allowedHeaders("*")
                .allowedMethods("*")
                .allowedOrigins("*")
                .maxAge(1800);
                //.allowedOrigins("http://localhost:8081");
    }
}

（3）配置 Bean - CorsFilter

package com.zhuantai.cors01.config;

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;

/**
 * @author ANTIA1
 * @date 2021/7/8 11:38
 */
@Configuration
public class WebMvcConfig {
    @Bean
    CorsFilter corsFilter(){
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        CorsConfiguration cfg = new CorsConfiguration();
        cfg.addAllowedOrigin("http://localhost:8081");
        cfg.addAllowedMethod("*");
        source.registerCorsConfiguration("/**",cfg);
        return new CorsFilter(source);
    }
}

推荐阅读