在 SpringBoot 中设置允许跨域请求

时间:2021-10-05 09:05:20

一、前言

现在在团队做的项目(网站)都是前后端分离的
① 后台负责写接口、传递JSON,如下面一个 POST 请求(后台设置允许跨域请求后,DELETE、GET、PUT 也是可以的)
在 SpringBoot 中设置允许跨域请求
这是我最近写的众酬网项目,新增众酬项目,的接口
② 前台负责解析JSON、设计界面
要实现接口可以给前端访问,还要设置允许跨域访问接口

参考文章
SpringBoot下如何配置实现跨域请求?

二、代码

package com.zcw.conf;

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 linhongcun * */
@Configuration
public class CorsConfig {
    private CorsConfiguration buildConfig() {
        CorsConfiguration corsConfiguration = new CorsConfiguration();
        corsConfiguration.addAllowedOrigin("*"); // 允许任何域名使用
        corsConfiguration.addAllowedHeader("*"); // 允许任何头
        corsConfiguration.addAllowedMethod("*"); // 允许任何方法(post、get等)
        return corsConfiguration;
    }

    @Bean
    public CorsFilter corsFilter() {
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        source.registerCorsConfiguration("/**", buildConfig()); // 对接口配置跨域设置
        return new CorsFilter(source);
    }
}

三、其他

以上的代码基本是常识了,记录一下,
Ajax 请求示例:

<!DOCTYPE html>
<html>

    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <script src="js/jquery-1.7.2.js"></script>
    <script type="text/javascript"> function upd() { $.ajax({ type: "get", data: "a=1", url: "http://120.79.197.131:8080/user/getAllUser", success: function(result) { console.log(result); } }); } </script>
    <body>
        <!--获取-->
        <button id="btn2" onclick="upd()">Get request 获取</button>
    </body>

</html>