axios使用和前后端跨域问题

zk计科小牛马2025-03-08 13:08

一、axios使用

1.安装

在创建好的vue项目的终端跑一下命令

npm install axios

2.在main.js文件里面导入全局配置

3.在需要的组件使用

由于第二步的配置，已经配置了全局的起步路径还有axios的别名$http，理解即可

二、跨域的配置

在控制器上面添加CrossOrigin注解实现

上面是注解配置，只在一个Controller上生效，还可以创建一个全局生效的配置类

java 复制代码

@Configuration
public class CorsConfig {
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**") //允许跨域访问的路径
                .allowedOrigins("*") //允许跨域访问的源
                .allowedMethods("GET", "HEAD", "POST", "PUT", "DELETE", "OPTIONS")
                .allowCredentials(true) //是否允许发送Cookie
                .maxAge(168000) //预检间隔时间
                .allowedHeaders("*"); //允许头部设置
    }
}