话不多说,我们直接来看示例
React Native 使用 fetch
进行网络请求,推荐Promise
的形式进行数据处理。
官方的 Demo 如下:
但是实际在进行开发的时候,却发现了PHP打印出 $_POST
为空数组。
这个时候自己去搜索了下,提出了两种解决方案:
一、构建表单数据
return encodeURIComponent(key) + '=' + encodeURIComponent(val);
}).join('&') : '';
}
// fetch
body: toQueryString(obj)
但是这个在自己的机器上并不生效。
二、服务端解决方案
这个时候就可以打印出数据了。然而,我们的问题是 服务端的接口已经全部弄好了,而且不仅仅需要支持ios端,还需要web和Android的支持。这个时候要做兼容我们的方案大致如下:
1、我们在fetch
参数中设置了 header
设置 app
字段,加入app
名称:ios-appname-1.8
;
2、我们在服务端设置了一个钩子:在每次请求之前进行数据处理:
// 对 RN fetch 参数解码
if($appName == 'your settings') {
$json = file_get_contents('PHP://input');
$_POST = json_decode($json,TRUE );
}
这样服务端就无需做大的改动了。
对 Fetch的简单封装
由于我们的前端之前用 jquery较多,我们做了一个简单的fetch
封装:
if(res.errcode != 0) {
self.handeErrcode(res);
}
return cb(res,res.errcode==0);
})
.catch((error) => {
console.warn(error);
});
},handeErrcode: function(result) {
//
if(result.errcode == 123){
return false;
}
console.log(result);
return this.sendMessage(result.errstr);
},// 提示类
sendMessage: function(msg,title) {
if(!msg) {
return false;
}
var title = title || '提示';
AlertIOS.alert(title,msg);
}
};
module.exports = App;
这样开发者可以这样使用:
总结
好了,到这里PHP获取不了React Native Fecth参数的问题就基本解决结束了,希望本文对大家的学习与工作能有所帮助,如果有疑问或者问题可以留言进行交流。