无论何种平台,网络数据的获取都是十分重要的,最近学习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数据的更多相关文章

  1. android客户端从服务器端获取json数据并解析的实现代码

    今天总结一下android客户端从服务器端获取json数据的实现代码,需要的朋友可以参考下   首先客户端从服务器端获取json数据 1.利用HttpUrlConnection /** * 从指定的U ...

  2. (转)android客户端从服务器端获取json数据并解析的实现代码

    今天总结一下android客户端从服务器端获取json数据的实现代码,需要的朋友可以参考下       首先客户端从服务器端获取json数据 1.利用HttpUrlConnection   复制代码 ...

  3. android客户端从服务器端获取json数据并解析的实现代码(重要)

    首先客户端从服务器端获取json数据 1.利用HttpUrlConnection /** * 从指定的URL中获取数组 * @param urlPath * @return * @throws Exc ...

  4. jquery用ajax方式从后台获取json数据后如何将内容填充到下拉列表

    对于问题从后台获取json数据,将内容填充到下拉列表,代码非常简单,具体过程请看下面代码. 需求:url:链接     par:ID       sel:下拉列表选择器 function BuildS ...

  5. Netflix Falcor获取JSON数据

    Netflix开源了JavaScript库Falcor,它为从多个来源获取JSON数据提供了模型和异步机制. Netflix利用Falcor库实现通过JSON数据填充他们网页应用的用户界面.所有来自内 ...

  6. jquery通过ajax方法获取json数据不执行success

    1.jquery通过ajax方法获取json数据不执行success回调 问题描述:jquery通过ajax方法获取json数据不执行success回调方法 问题原因:json格式存在问题或不符合标准 ...

  7. jquery用ajax方式从后台获取json数据,将内容填充到下拉列表。

    从后台获取json数据,将内容填充到下拉列表. url:链接 par:ID sel:下拉列表选择器 //获取下拉列表 function BuildSelectBox(url, par, sel) { ...

  8. JQuery 获取json数据$.getJSON方法的实例代码

    这篇文章介绍了JQuery 获取json数据$.getJSON方法的实例代码,有需要的朋友可以参考一下 前台: function SelectProject() { var a = new Array ...

  9. Jquery 模板插件 jquery.tmpl.js 的使用方法(1):基本语法,绑定,each循环,ajax获取json数据

    jquery.tmpl.js 是一个模板js  ,主要有2个方法 (1):$.template()方法,将一段script或者是Html编译为模板,例如 $.template('myTemplate' ...

  10. jquery通过ajax方法获取json数据不执行success回调

    问题描述:jquery通过ajax方法获取json数据不执行success回调方法 问题原因:json格式存在问题或不符合标准写法,导致总是执行error回调方法 解决方案:使json格式务必符合下述 ...

随机推荐

  1. c#中快速排序的学习

    最近看了一句话,说的是在现实生活中,会写字的人不见得会写出好文章,学习编程语言就像是学会了写字,学会了编程语言并不一定能写出好程序. 我觉得就是很有道理,以前读书的时候,基本学完了C#中的语法知识,算 ...

  2. 【BZOJ3193】 [JLOI2013]地形生成

    BZOJ3193 [JLOI2013]地形生成 Solution 第一问不是很简单吗? 直接计数就好了. 第二问思考无果看了看hyj神仙的代码,发现可以dp求解. 具体可以看代码(其实主要是我说不清楚 ...

  3. Speech Synthesis

    <Window x:Class="Synthesizer.MainWindow" xmlns="http://schemas.microsoft.com/winfx ...

  4. 游戏AI玩伴,是“神队友”还是“猪队友”?

    “一代英豪”暴雪迎来了自己的暴风雪. 2月13日,动视暴雪公布了2018年全年财报.财报显示,暴雪第四季度营业收入仅为28.4亿美元,低于华尔街分析师预期的30.4亿美元.在公布了财报业绩后,该公司又 ...

  5. 前端基础-html 介绍和head标签 ( 1 )

    主要内容 web标准 浏览器介绍 开发工具介绍 HTML介绍 HTML颜色介绍 HTML规范 HTML结构详解 写在前面: 前端               后端 C(client)        S ...

  6. Git-工作区和暂存区的概念

      工作区(Working Directory):就是在电脑里能看到的目录,如testcase文件夹就是一个工作区. 版本库(Repository):工作区有一个隐藏目录.git,是Git的版本库. ...

  7. 课程一(Neural Networks and Deep Learning),第二周(Basics of Neural Network programming)—— 2、编程作业常见问题与答案(Programming Assignment FAQ)

    Please note that when you are working on the programming exercise you will find comments that say &q ...

  8. python实战问题记录

    开发环境搭建 1.安装aiohttp这个异步的http框架失败 提示使用pip更高版本,但是更新之后,还是无法使用.所以,我们采用anaconda中的aiohttp,即打开anaconda,然后进入E ...

  9. Redmine 删除 project 中的 public 选项

    缘由:由于manager的错误设置,导致本不该public的项目设置成public 诉求:去除项目新建及设置时的public勾选 1.查找日志 由于redmine是拿ruby编写的,且主页等都是由ht ...

  10. Mac 下使用 brew 安装软件

    官网:http://brew.sh/安装 ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/m ...