问题描述:

        前端请求只要 header 中携带 token 就会导致请求跨域

问题分析:

        当请求为复杂请求时浏览器会发送一个预检请求,就像图中那样

        预检请求跨域需要额外在 sa-token 的配置文件中配置

  • 预检请求:属于CORS机制中的重要环节,在发送复杂跨域请求之前,浏览器先向目标服务器发送一个探测性的 OPTIONS HTTP 请求,来询问服务器是否允许该跨域请求;
  • 复杂请求:只要满足下面一条就是复杂请求:使用了非 GET、HEAD、POST的HTTP方法;使用了 Content-Type: application/json 或其他非简单请求允许的 Content-Type;包含了任何自定义头;

解决方法:

        在 sa-token 的全局配置中增加方法

    /**
     * CORS 跨域处理策略
     */
    @Bean
    public SaCorsHandleFunction corsHandle() {
        return (req, res, sto) -> {
            res.
                    // 允许指定域访问跨域资源
                            setHeader("Access-Control-Allow-Origin", "*")
                    // 允许所有请求方式
                    .setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE")
                    // 有效时间
                    .setHeader("Access-Control-Max-Age", "3600")
                    // 允许的header参数
                    .setHeader("Access-Control-Allow-Headers", "*");
            // 如果是预检请求,则立即返回到前端
            SaRouter.match(SaHttpMethod.OPTIONS)
                    .free(r -> System.out.println("--------OPTIONS预检请求,不做处理"))
                    .back();
        };
    }
Logo

北京人形旗下天工造物具身智能开源社区,聚焦具身天工与慧思开物两大平台

更多推荐