vue+element 学习之路(六)proxyTable设置跨域,axios和qs封装请求体

proxyTable:
就拿我自己正在练手的项目来说,我需要用到前后端分离,前端在VSCODE上开发,端口为8081
vue+element 学习之路(六)proxyTable设置跨域,axios和qs封装请求体_第1张图片
后端选择Ecplise,springboot 端口为8080

vue+element 学习之路(六)proxyTable设置跨域,axios和qs封装请求体_第2张图片
所以如果每次前端发送请求都带上http://localhost:8080的话显得十分冗余。proxyTable就很好的帮我们实现了代理。

配置方法:
首先找到cofig文件夹下的index.js配置文件,改写proxyTable方法,设置自己后端的域名(或其他域名)

补充:被遮挡的部分:assetsPublicPath:’/’

vue+element 学习之路(六)proxyTable设置跨域,axios和qs封装请求体_第3张图片

用法:

在这里插入图片描述

后端接口:

vue+element 学习之路(六)proxyTable设置跨域,axios和qs封装请求体_第4张图片
还有一个我本人喜欢的传参方法,在传参时我比较喜欢传一整个对象到后台,在其他前辈方法的指引下总结了一个方法分享给大家

安装axios qs
npm install --save axios
npm install qs --save-dev

main.js页面

vue+element 学习之路(六)proxyTable设置跨域,axios和qs封装请求体_第5张图片使用方法:
在这里插入图片描述
vue+element 学习之路(六)proxyTable设置跨域,axios和qs封装请求体_第6张图片
接口以一个对象接受
在这里插入图片描述

你可能感兴趣的:(vue+element 学习之路(六)proxyTable设置跨域,axios和qs封装请求体)