微信小程序(三):网络请求


Posted in Javascript onJanuary 13, 2017

前文讲配置的时候我们说过,开发小程序时可以选择有 APPID 和 无 APPID ,两种方式。

1. 当有APPID的情况下,进行网络通信,只能和指定的域名进行通信。如果没有进行配置,编译时会报如下错误:

微信小程序(三):网络请求

配置方法:

设置域名

需要在微信公众平台的小程序中设置域名。在微信小程序的设置界面可以看到设置选项:

微信小程序(三):网络请求

选择开发设置:

微信小程序(三):网络请求

可以看到服务器设置:

微信小程序(三):网络请求

这里我们可以设置我们这个APPID可以访问的域名,每种最多可以设置两个。(注意,此处只能使用 https 的域名,这个申请过程需要花费一定的时间)

2. 当没有APPID的情况下,就方便多了,可以随意进行网络请求,不限制域名,但是,这种情况下不能进行发布,也不能在手机上预览。如果想正式做小程序开发,还是需要有一个https的域名,但是学习的情况下http的就足够了。

在小程序中网络请求大致分为四种类型。

  •  普通HTTPS请求(wx.request)
  •  上传文件(wx.uploadFile)
  •  下载文件(wx.downloadFile)
  •  WebSocket通信(wx.connectSocket)

这里主要讲 wx.request:

使用wx.request可以发起一个http请求,一个微信小程序被限制为同时只有5个网络请求。注意是同时。

wx.request({
      url: 'http://192.168.1.137:80/app/guanggao',
      method: 'POST',
      data: {
         type: "1"
      },
      header: {
        'Accept': 'application/json'
      },
      success: function (res) {
        that.setData({
          images: res.data.data.guanggao
        })
      }
      fail:function(err){
        console.log(err)
      }
    })

上面的代码会发送一个http get请求,其中的参数也比较容易理解。

  •  url 服务器的url地址
  •  data 请求的参数可以采用String data:”xxx=xxx&xxx=xxx”的形式或者Object data:{“userId”:1}的形式
  •  header 设置请求的header
  •  method http的方法,默认为GET请求
  •  success 接口成功的回调
  •  fail 接口失败的回调

另外还有一个参数没有在代码里: 

  •  complete 调用接口结束之后的回调,无论成功或者失败该接口都会被调用

超时的设置

在前文中已经提到了在app.js中设置networkTimeout可以设置四种类型网络访问的超时时间:

"networkTimeout":{
  "request": 10000,
  "connectSocket": 10000,
  "uploadFile": 10000,
  "downloadFile": 10000
}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
用js脚本控制asp.net下treeview的NodeCheck的实现代码
Mar 02 Javascript
Javascript延迟执行实现方法(setTimeout)
Dec 30 Javascript
javascript 使td内容不换行不撑开
Nov 29 Javascript
jQuery实现默认是闭合的FAQ展开效果菜单
Sep 14 Javascript
JavaScript的代码编写格式规范指南
Dec 07 Javascript
js判断用户是输入的地址请求的路径(实例讲解)
Jul 18 Javascript
深入探究node之Transform
Jul 20 Javascript
vuejs2.0运用原生js实现简单拖拽元素功能
Aug 21 Javascript
jQuery提示框插件SweetAlert用法分析
Aug 05 jQuery
JointJS JavaScript流程图绘制框架解析
Aug 15 Javascript
Layui给switch添加响应事件的例子
Sep 03 Javascript
jQuery cookie的公共方法封装和使用示例
Jun 01 jQuery
Javascript自定义事件详解
Jan 13 #Javascript
JavaScript简单生成 N~M 之间随机数的方法
Jan 13 #Javascript
微信小程序 增、删、改、查操作实例详解
Jan 13 #Javascript
jQuery动态生成表格及右键菜单功能示例
Jan 13 #Javascript
Vue数据驱动模拟实现5
Jan 13 #Javascript
利用HTML5+Socket.io实现摇一摇控制PC端歌曲切换
Jan 13 #Javascript
使用jQuery的ajax方法向服务器发出get和post请求的方法
Jan 13 #Javascript
You might like
php下使用无限生命期Session的方法
2007/03/16 PHP
PHP实现图片裁剪、添加水印效果代码
2014/10/01 PHP
php使用CURL模拟GET与POST向微信接口提交及获取数据的方法
2016/09/23 PHP
网页前台通过js非法字符过滤代码(骂人的话等等)
2010/05/26 Javascript
jQuery 操作option的实现代码
2011/03/03 Javascript
jQuery对象数据缓存Cache原理及jQuery.data方法区别介绍
2013/04/07 Javascript
JavaScript打印iframe内容示例代码
2013/08/20 Javascript
jQuery插件jQuery-JSONP开发ajax调用使用注意事项
2013/11/22 Javascript
Node.js事件循环(Event Loop)和线程池详解
2015/01/28 Javascript
asp.net+js实现金额格式化
2015/02/27 Javascript
轻松学习jQuery插件EasyUI EasyUI创建树形菜单
2015/11/30 Javascript
node.js 中国天气预报 简单实现
2016/06/06 Javascript
Bootstrap CDN和本地化环境搭建
2016/10/26 Javascript
基于Phantomjs生成PDF的实现方法
2016/11/07 Javascript
JavaScript中三种常见的排序方法
2017/02/24 Javascript
Angularjs 1.3 中的$parse实例代码
2017/09/14 Javascript
详解React-Router中Url参数改变页面不刷新的解决办法
2018/05/08 Javascript
微信小程序实现点击图片放大预览
2019/10/21 Javascript
vue路由 遍历生成复数router-link的例子
2019/10/30 Javascript
vue实现输入一位数字转汉字功能
2019/12/13 Javascript
微信小程序通过websocket实时语音识别的实现代码
2020/08/19 Javascript
python通过自定义isnumber函数判断字符串是否为数字的方法
2015/04/23 Python
Python爬虫包BeautifulSoup学习实例(五)
2018/06/17 Python
使用python turtle画高达
2020/01/19 Python
python-sys.stdout作为默认函数参数的实现
2020/02/21 Python
python实现逆滤波与维纳滤波示例
2020/02/26 Python
pycharm专业版远程登录服务器的详细教程
2020/09/15 Python
Nike荷兰官方网站:Nike.com (NL)
2018/04/19 全球购物
意大利一家专营包包和配饰的网上商店:Borse Last Minute
2019/08/26 全球购物
自我评价格式
2014/01/06 职场文书
工程资料员岗位职责
2014/03/10 职场文书
先进个人材料怎么写
2014/12/30 职场文书
酒店客房服务员岗位职责
2015/04/09 职场文书
2019新员工试用期转正工作总结范文
2019/08/21 职场文书
JS封装cavans多种滤镜组件
2022/02/15 Javascript
Java由浅入深通关抽象类与接口(下篇)
2022/04/26 Java/Android