前后端分离 已经是web开发的主流,在前后端对接的过程中难免会碰到各式各样的问题,本文对近期项目中遇到的与 POST请求 有关的问题做了一个简要的汇总和分析,并列出了与之相关的解决办法。
第一、POST请求发生服务器500错误
问题: 一次调用POST请求过程中,接口报500错误,接口错误属于服务器内部错误,原以为是后台的接口有问题,立马将500问题向后台反馈,然而后台却告知接口测试正常。看来问题的根源在前端,我仔细看了看代码之后发行,原来是自己在发起POST请求时忘记提交参数。
解决:完善请求参数
第二、POST请求发生405错误
问题:发起POST请求,控制台反馈405 Method Not Allowed405错误提示如图:
解决:错误原因比较直接,是用错了method方法,将method由GET改成POST即可
第三、前端POST请求成功,后台却获取不到数据
问题:
近期基于UNI-APP提供的uni.request()方法封装了一个简易的拦截器,在之前的项目中不管是POST还是GET都能正常使用,但最近的一个项目中却发生了GET请求正常,POST请求后台无法获取到数据的问题由于之前的成功经历,让我直接忽略了请求配置的问题,而是从其它方面思考问题发生的原因。比如:
检查参数及格式是否有问题(毕竟吃过一次亏)
将参数使用JSON.stringfy进行格式化
将method设置为get (显然不对,后台接口明显要求是POST)
经过一番尝试之后最终定位问题是Content-Type设置不正确所致。
解决:
将请求头的Content-Type属性设置为'application/x-www-form-urlencoded'
uni.request()默认Content-Type 为"application/json",设置前后的Content-Type分别见下图:
第四、POST请求后台提示参数格式不正确
问题:发生在Vue+axios项目中,项目中使用get请求一切正常,使用POST请求却一直提示参数格式不正确,一开始还以为是和【问题三】一样是由于Content-Type配置不正确导致,结果将Content-Type换了个便也没有解决问题。最终依靠万能度娘解决
解决:使用qs格式化POST请求参数
第五、POST请求后台提示参数格式不正确
前端调用后端POST接口,向后台提交一个字符串数据,结果接口一直返回参数格式不正确,打开调试才知道参数未能被后端正确解析。然而后端本地调试一切正常,看来锅在前端无疑了。后端接受JSON格式参数,然而 抓取axios POST请求发现Content-Type为application/x-www-form-urlencoded。此时将Content-Type设置为application/json
再次发起请求,发现问题依旧。检查前后端代码发现传参POST传参时需要对参数调用JSON.stringfy()进行格式化。
解决:
1、首先设置Content-Type:headers["Content-Type"]="application/json"
2、JSON.stringfy()格式化参数data:JSON.stringfy( param )