博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
微信小程序 POST传值跳坑
阅读量:5154 次
发布时间:2019-06-13

本文共 3298 字,大约阅读时间需要 10 分钟。

1.post请求

wx.request
发起的是 HTTPS 请求。一个微信小程序,同时只能有5个网络请求连接。
官网上描述

参数名 类型 必填 说明
url String 开发者服务器接口地址
data Object、String 请求的参数
header Object 设置请求的 header , header 中不能设置 Referer
method String 默认为 GET,有效值:OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT
success Function 收到开发者服务成功返回的回调函数,res = {data: '开发者服务器返回的内容'}
fail Function 接口调用失败的回调函数
complete Function 接口调用结束的回调函数(调用成功、失败都会执行)

微信小程序示例

wx.request({  url: 'test.php', //仅为示例,并非真实的接口地址  data: {        x: '' , y: '' }, header: { 'content-type': 'application/json' }, success: function(res) { console.log(res.data) } })

这种请求GET方式是ok的,header头也可以不用添加。

但是POST就有比较大的问题了。

我使用以下代码进行调试(代码一):

wx.request({    url: ApiHost + '/?service=default.getOrderInfo',    data: {      'order_id': order_id }, method: 'POST', success: function (res) { // console.log(res); if (res.data.ret == 200) { //something to do } else{ //something to do } } fail: function (res) { console.log(res); } });

注意看下图,微信开发工具里面的提示:

 
2016-12-21_111056.png

POST 请求会将data的值放在Request Payload里面,而不是Query String Parameters里面,后端服务器如果不注意,就无法取到数据。

网上很多改法,是这样的。----加上header头

wx.request({    url: ApiHost + '/?service=default.getOrderInfo',    data: {      //数据urlencode方式编码,变量间用&连接,再post 'order_id='+order_id }, method: 'POST', header:{ 'content-type':'application/x-www-form-urlencoded' }, success: function (res) { // console.log(res); if (res.data.ret == 200) { //something to do } else{ //something to do } } fail: function (res) { console.log(res); } });

这样修改的话,后端可以不用特别处理。

但是............

因为还是想用标准的方法做,那只有修改后端服务器啦。

我这边使用的是Phalapi框架,推荐下~~~

if(DI()->request->getHeader('content-type')){      $contentType = DI()->request->getHeader('content-type');}if(!empty($contentType)&&(strtolower(@$contentType) === 'application/json')) { $HTTP_RAW_POST_DATA = isset($GLOBALS['HTTP_RAW_POST_DATA']) ? $GLOBALS['HTTP_RAW_POST_DATA'] : "{}"; DI()->request = new PhalApi_Request(array_merge($_GET,json_decode($HTTP_RAW_POST_DATA, true))); }

终于,在pc上用代码一调试通过。用上标准请求,也不用application/x-www-form-urlencoded这种模式。

不过.....用上真机调试,怎么又接收不到请求参数了。怪事。。。。。。。。。

最后通过抓包分析

真机端

POST /?service=default.getOrderInfo HTTP/1.0Host: proxyConnection: closeContent-Length: 43Content-Type: application/jsonAccept-Encoding: gzip, deflateAccept: */*User-Agent: Mozilla/5.0 (iPhone; CPU iPhone OS 9_3_5 like Mac OS X) AppleWebKit/601.1.46 (KHTML, like Gecko) Mobile/13G36 MicroMessenger/6.5.1 NetType/WIFI Language/zh_CNReferer: https://servicewechat.com/###/0/page-frame.htmlAccept-Language: zh-cn{
"order_id":"011T00wO0gZVR72P89tO0DFNvO0T00w0"}

pc模拟开发端

POST /?service=default.getOrderInfo HTTP/1.0Host: proxyConnection: closeContent-Length: 43Origin: http://###.appservice.open.weixin.qq.comX-Requested-With: XMLHttpRequestUser-Agent: Mozilla/5.0 (Windows NT 6.3; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/53.0.2785.143 Safari/537.36 appservice webview/100000content-type: application/jsonAccept: */*Referer: https://servicewechat.com/####/devtools/page-frame.htmlAccept-Encoding: gzip, deflate, br{
"order_id":"011T00wO0gZVR72P89tO0DFNvO0T00w0"}

最后找到区别:

Content-Type 与 content-type
模拟器默认是content-type
真机默认是Content-Type
后端服务器增加处理Content-Type 就搞定了。

作者:tototo163
链接:https://www.jianshu.com/p/f95f64b393d1
來源:简书
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

转载于:https://www.cnblogs.com/ordinaryk/p/8430462.html

你可能感兴趣的文章
Linux系统学习之 三:新手必须掌握的Linux命令3
查看>>
iOS高仿微信悬浮窗、忍者小猪游戏、音乐播放器、支付宝、今日头条布局滚动效果等源码...
查看>>
bugscan泄露代码解密
查看>>
利用Code128字体将文本转换为code128条形码
查看>>
Apicloud_(问题)P54提示错误:Uncaught SyntaxError: Unexpected token ) at main.html : 117
查看>>
使用Rss框架PHP开发流程
查看>>
Jmeter_模板&设置默认请求参数
查看>>
HTML注释
查看>>
Activiti 用户任务并行动态多实例(多用户执行流程)
查看>>
JAM的计数法
查看>>
[AngularJS + Webpack] require directives
查看>>
中间介
查看>>
在win32/安卓开发环境下编译BOX2D代码
查看>>
【JPA】字段访问、属性访问及混合访问
查看>>
斐波那契数列(Fibonacci)递归和非递归实现
查看>>
dbname, instance, sid
查看>>
HDU 2577 How to Type
查看>>
LA 4123 (计数 递推) Glenbow Museum
查看>>
HDU 1533 二分图最小权匹配 Going Home
查看>>
关于学习Python的一些心得
查看>>