vue----前后台联调操作总结

查看ip：命令窗输入【ipconfig】

测试连接:【ping ip】

联调测试：【curl http://***.***.***.***:80/login -X POST -d "name=admin&&password=admin"】

curl是一个利用URL语法在命令行下工作的文件传输工具，支持文件上传和下载。

利用axios进行http请求：

var axios = require("axios")
axios.post("http://172.20.10.4:8000/login", {
    username: "admin",
    password: "123456"
}).then(function (response) {
    console.log(response)
})

---

修改【config/index.js】中的【proxyTable】，设置ip地址及端口号，如下图

/api用来代替【target】后的url，在组件中进行前后台数据获取时，只需在/api添加相应的接口即可，无需写入【target】后的url。

created() {
    //获取文件清单列表
    axios
      .post("/api/getAllFileName/", {
        fileId: this.fileId
      })
      .then(data => {
        console.log("输出data", data.data);
        if (data.data.status === "200") {
          this.file = data.data;
        }
      });
  }

上面代码中，即用"/api/getItemDetail/"代替了“http://***.***.***.***:80/getItemDetail/”