无论何种平台,网络数据的获取都是十分重要的,最近学习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. 简单理解 OAuth 2.0 及资料收集,IdentityServer4 部分源码解析

    简单理解 OAuth 2.0 及资料收集,IdentityServer4 部分源码解析 虽然经常用 OAuth 2.0,但是原理却不曾了解,印象里觉得很简单,请求跳来跳去,今天看完相关介绍,就来捋一捋 ...

  2. 在WPF中将图片转换成3D图像并可以旋转

    时光偷走的,永远都是我们眼皮底下看不见的珍贵. https://pan.baidu.com/s/14dk-OU2SR0nxXj2bL4bVpQ 源码网站https://www.codeproject. ...

  3. Lerning Entity Framework 6 ------ Introduction to TPH

    Sometimes, you have created two models. They have the same parent class like this: public class Pers ...

  4. java实现点选汉字验证码

    package com.rd.p2p.web; import java.awt.BasicStroke; import java.awt.Color; import java.awt.Font; im ...

  5. Python 绝技 —— TCP服务器与客户端

    i春秋作家:wasrehpic 0×00 前言 「网络」一直以来都是黑客最热衷的竞技场.数据在网络中肆意传播:主机扫描.代码注入.网络嗅探.数据篡改重放.拒绝服务攻击……黑客的功底越深厚,能做的就越多 ...

  6. [JavaScript] 跳出循环方法总结

    1.forEach() 方法对数组的每个元素执行一次提供的函数.但是没有办法中止或者跳出 forEach 循环,除了抛出一个异常,该方法没有返回值,return/return false/return ...

  7. postgresql-hdd,ssd,效率

    既有ssd又有hdd是将数据存储到ssd还是将索引存储到ssd的效率更高呢? 一种说法是索引是随机扫描,将索引放入ssd效率会增高, 一种说法是将数据放入ssd效率更高   最好的情况是将数据和索引都 ...

  8. switch...case... 语句中的类型转换

    switch语句对case表达式的结果类型有如下要求: 要求case表达式的结果能转换为switch表示式结果的类型 并且如果switch或case表达式的是无类型的常量时,会被自动转换为此种常量的默 ...

  9. babel 7 简单指北

    babel 7 对于 babel 7,babel 的官网已经介绍得非常详细了,但有时感觉文档和实际使用总是差那么一点东西. 主要包 先来看一下主要的包,babel 7 对于包进行了一些简化. @bab ...

  10. WebDriver高级应用实例(10)

    10.1控制HTML5语言实现的视频播放器 目的:能够获取html5语言实现的视频播放器视频文件的地址.时长.控制进行播放暂停 被测网页的网址: http://www.w3school.com.cn/ ...