个人健康管理平台 2 前后端交互（跨域）

2 前后端交互（跨域）

2.1 为什么要做跨域处理

简单在vue 中写个get命令，获得后端数据，但是不进行跨域处理，得到的结果会拒绝访问

2.2 后端处理跨域问题

添加一个跨域配置文件 CrosConfig.java

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

/**
 * 跨域处理配置类
 * Spring容器加载
 */
@Configuration
public class CorsConfig implements WebMvcConfigurer {
    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry
                // 允许访问的路径
                .addMapping("/**")
                // 配置请求来源
                .allowedOrigins("http://localhost:8081")
                // 配置允许跨域访问的方法
                .allowedMethods("GET", "POST", "DELETE", "PUT", "OPTION")
                // 允许请求头
                .allowCredentials(true)
                // 最大效应时间
                .maxAge(3600);
    }
}