年底了最近也比较忙没怎么有时间来写博客，今晚找个时间回想一下遇到的一些令人深刻的坑，并写上解决方案；希望能帮到更多的人填坑。
1.webpack配置devServer proxy前后端分离接口返回504的问题
问题描述：配置webpack devServer proxy后端接口的时候，前面几个接口能正常访问，后面配置的接口居然504；按理说这些配置要错就全错，怎么有的可以访问有的不可以。
当时的配置是这样的：
1 devServer: { 2 historyApiFallback: true, 3 noInfo: true, 4 proxy: { 5 '/api1': { 6 target: 'http://xxxxxxxx', 7 secure: false 8 }, 9 '/api2': {10 target: 'http://xxxxxxxx',11 secure: false12 },13 '/api3': {14 target: 'http://xxxxxxxx',15 secure: false16 }17 }18 },
当时接口 '/api1','/api2'都是可以正常访问的'/api3'却504，一开始我以为后台报错了，得到 后台同事确认说接口没问题之后。我就去查坑，后面去看了官方的文档换了另一种方式配置就好了
也比较方便后面添加接口。（PS：这里不得不说webpack的配置可真多）
devServer: { historyApiFallback: true, noInfo: true, proxy: [ { context: ['/index', '/psActivities', '/searchType','/searchJd','/topSeach','/winners' ,'/notice', '/getBaseSummary', '/navigation', '/banners', '/login', '/knowledgeCompetition', '/getIndiProfile', '/addAnswer'], target: 'http://xxxxx', changeOrigin: true, secure: false } ] },
proxy变成了一个数组形式，然后数组里添加对象，context里放接口数组就好了。
2.axios POST提交405问题
项目中有个表单提交，跟后台同事约定接口方式是POST。万事具备，当我信心满满点提交按钮的时候，呃呃，报错了。报了405。我在想，怎么会报错呢？接口没问题啊，然后我换成get方式提交，居然可以了。带着疑问找了后台同事，为什么我接口提交GET可以POST不行呢?他说你有没有提交对啊？我说没错啊，结果一看，后台写的接口的方式是GET。。。（这里笑哭表情），结果改成POST提交就可以了。
不得不说，这个坑踩得有点 冤枉。
附上axiosPOST提交方式代码：
1 axios({ 2 url: '/login', 3 method: 'post', 4 data: { 5 mobile: user.phone, 6 userName: user.name 7 }, 8 transformRequest: [function (data) { 9 let ret = ''10 for (let it in data) {11 ret += encodeURIComponent(it) + '=' + encodeURIComponent(data[it]) + '&'12 }13 return ret14 }],15 headers: {16 'Content-Type': 'application/x-www-form-urlencoded'17 }18 }).then( res => {19 console.log(res);20 }).catch(err => {21 console.log(err, "login");22 });
注：本文内容来自互联网，旨在为开发者提供分享、交流的平台。如有涉及文章版权等事宜，请你联系站长进行处理。