解决springboot 前端 axios跨域问题

最新推荐文章于 2024-05-04 00:47:35 发布

yxblog

最新推荐文章于 2024-05-04 00:47:35 发布

阅读量424

点赞数 8

文章标签： spring boot 前端后端

本文链接：https://blog.csdn.net/weixin_58056230/article/details/136082006

版权

1.后端开启跨域请求（boot）端

package com.example.config;

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


// 允许所有请求跨域访问
@Configuration
public class CorsConfig {

    @Bean
    public WebMvcConfigurer corsConfigurer() {
        return new WebMvcConfigurer() {
            @Override
            public void addCorsMappings(CorsRegistry registry) {
                registry.addMapping("/**")
                        .allowedOrigins("*")
                        .allowCredentials(true)
                        .allowedHeaders("*")
                        .allowedMethods("GET", "POST", "PUT", "DELETE", "OPTIONS")
                        .maxAge(3600)
                        .allowCredentials(false);
            }
        };
    }
}

配置好后就可以正常访问，后端如果加拦截器后，前端发请求会有一个OPTIONS预检测请求，如果拦截器不反回可以访问后段的请求信息的话，前端会默认后端不允许跨域，就会出现前端访问失败的问题，解决方案如下

public class MyInterceptor implements HandlerInterceptor {
    // 在请求处理之前执行的逻辑，比如身份验证
    @Override
    public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception {
        if ("OPTIONS".equals(request.getMethod())) {
            // 处理预请求，设置允许跨域的信息
            response.setHeader("Access-Control-Allow-Origin", "*");
            response.setHeader("Access-Control-Allow-Methods", "GET,POST,PUT,DELETE");
            response.setHeader("Access-Control-Allow-Headers", "*");
            response.setHeader("Access-Control-Max-Age", "3600");
            return false;
        }
        System.out.println( request.getHeader("Authorization"));
       if (request.getHeader("Authorization").isEmpty()){
           response.setStatus(401);
           response.setContentType("application/json");
           response.getWriter().println("This user does not have permission");
           return false;
       }
        Map<String, Object> stringObjectMap = JwtExample.checkToken(request.getHeader("Authorization"));
       if (stringObjectMap.isEmpty()){
           response.setStatus(401);
           response.setContentType("application/json");
           response.getWriter().println("Login has expired");
           return false;
       }
        return true;
    }
}