Vue使用axios访问Java后端API接口

环境介绍：

前端：Vue自己新建了一个最原始的项目。

后端：SpringBoot搭建的一个简单的增删改查。

首先要确定后端的数据是否能正常的访问

可以正常访问的话 进行下一步：

使用axios方法：

1.使用终端工具执行 npm install axios 命令安装axios

2.在/src/main.js文件下加入这两行代码。axios.defaults.baseURL=“改成你后端的地址”

3.在/src/components/HelloWorld.vue文件中的script标签中引入下面的代码：

4.本以为这样就可以把项目跑起来了 ，结果在控制台报了跨域的错误。在后端Controller层的接口上添加 @CrossOrigin(allowCredentials = “true”, allowedHeaders = “*”) 问题解决。如下图

好啦~这样就不报错了。获取成功如下图：