weex stream 之fetch的get、post获取Json数据

无论何种平台，网络数据的获取都是十分重要的，最近学习weex，不可避免的要学习weex的数据请求方法了。网址

个人感觉，weex stream相较于其他平台，还算比较简单了，但是由于文档以及官方代码中的错误，导致网络请求很难获取到自己想要的数据，再次简单记录一下遇到的坑。

一、获取modal，stream，config对象

var modal = weex.requireModule('modal');

var stream = weex.requireModule('stream');

var config = require('./config.js')

二、get请求

get请求还好，按照官方的demo写就没什么问题了。

clickTypeGet:function(){

                                var me = this;

                stream.fetch({

                    method: 'GET',

                    type: 'json',

                    url: 'https://api.github.com/repos/alibaba/weex'

                }, function(ret) {

                    if(!ret.ok){

                        me.getResult = "request failed";

                        modal.toast({

                            'message': "失败",

                            'duration': 2.0

                        })

                    }else{

                        console.log('get---------:'+JSON.stringify(ret));

                        me.getResult = JSON.stringify(ret);

                        modal.toast({

                            message: JSON.stringify(ret),

                            duration: 2.0

                        })

                    }

                })

            },

三、post请求

clickTypePost:function(){

                var me = this;

                stream.fetch({

                    method:"POST",

                    type:'json',

                    url:'http://www.kuaidi100.com/query',

                    headers:{'Content-Type':'application/x-www-form-urlencoded'},

//                    body:'type=shentong&postid=3333557693903',

                    body:config.toParams(

                            {

                                type:'shentong',

                                postid:'',

                            })

//

//                    body:JSON.stringify({

//

//                        type:'shentong',

//                        postid:'3333557693903',

//                    }),

                }, function(ret) {

                    if(!ret.ok){

                        me.getResult = "request failed";

                        modal.toast({

                            'message': "失败",

                            'duration': 2.0

                        })

                    }else{

                        console.log('get---------:'+JSON.stringify(ret.data));

                        me.getResult = JSON.stringify(ret);

                        modal.toast({

                            message: JSON.stringify(ret.data),

                            duration: 2.0

                        })

                    }

                },function(progress) {

//                    JSON.stringify(progress.length);

                })

            }

这里的body不能像官方一样写，官方是这么写的：
事实证明，这么写，始终获取不到数据，也会提示数据请求成功，但是想要的数据却始终没有

                    body:JSON.stringify({

                        type:'shentong',

                        postid:'3333557693903',

                    }),

经过几番乱试，终于发现，只是因为body写法不对，造成的post请求获取不到数据，我们是这么写的

body:config.toParams(

                            {

                                type:'shentong',

                                postid:'',

                            })

其中的toParams是自己写的一个工具方法：

toParams(obj) {

        var param = ""

        for(const name in obj) {

            if(typeof obj[name] != 'function') {

                param += "&" + name + "=" + encodeURI(obj[name])

            }

        }

        return param.substring()

    },

小结：其实body字符串的格式是‘param1=p1&param2=p2’。

注意：fetch请求在电脑端浏览器会被提醒跨域，请求被拦截，直接用手机测试

巴特西

weex stream 之fetch的get、post获取Json数据

最新文章

热门文章