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


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 动态获取节点代码innerHTML分析 [IE,FF]
Nov 30 Javascript
jquery validator 插件增加日期比较方法
Feb 21 Javascript
JQuery EasyUI 加载两次url的原因分析及解决方案
Aug 18 Javascript
在浏览器中实现图片粘贴的jQuery插件-- pasteimg使用指南
Dec 29 Javascript
JavaScript动态修改背景颜色的方法
Apr 16 Javascript
javascript基于DOM实现权限选择实例分析
May 14 Javascript
Jquery左右滑动插件之实现超级炫酷动画效果附源码下载
Dec 02 Javascript
JavaScript的Number对象的toString()方法
Dec 18 Javascript
js实现简单的网页换肤效果
Jan 18 Javascript
jQuery判断邮箱格式对错实例代码讲解
Apr 12 jQuery
javascript异常处理实现原理详解
Feb 17 Javascript
微信小程序基础教程之echart的使用
Jun 01 Javascript
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
Amazon Prime Video平台《无限住人 -IMMORTAL-》2020年开始TV放送!
2020/03/06 日漫
PHP自定session保存路径及删除、注销与写入的方法
2014/11/18 PHP
PHP统计数值数组中出现频率最多的10个数字的方法
2015/04/20 PHP
PHP YII框架开发小技巧之模型(models)中rules自定义验证规则
2015/11/16 PHP
PHP文件缓存smarty模板应用实例分析
2016/02/26 PHP
PHP中Socket连接及读写数据超时问题分析
2016/07/19 PHP
Joomla框架实现字符串截取的方法示例
2017/07/18 PHP
实现JavaScript中继承的三种方式
2009/10/16 Javascript
js客户端快捷键管理类的较完整实现和应用
2010/06/08 Javascript
JavaScript调用客户端的可执行文件(示例代码)
2013/11/28 Javascript
jquery实现图片翻页效果
2013/12/23 Javascript
node.js中的fs.futimesSync方法使用说明
2014/12/17 Javascript
JS+CSS实现可拖动的弹出提示框
2015/02/16 Javascript
JavaScript获取并更改input标签name属性的方法
2015/07/02 Javascript
限制复选框最多选择项的实现代码
2016/05/30 Javascript
微信小程序 获取设备信息 API实例详解
2016/10/02 Javascript
Angular.js前台传list数组由后台spring MVC接收数组示例代码
2017/07/31 Javascript
在vue中解决提示警告 for循环报错的方法
2018/09/28 Javascript
彻底弄懂 JavaScript 执行机制
2018/10/23 Javascript
Vue 实现输入框新增搜索历史记录功能
2019/10/15 Javascript
[49:35]2018DOTA2亚洲邀请赛3月30日 小组赛A组 KG VS TNC
2018/03/31 DOTA
python二叉树的实现实例
2013/11/21 Python
Python对多属性的重复数据去重实例
2018/04/18 Python
Python 十六进制整数与ASCii编码字符串相互转换方法
2018/07/09 Python
Python zip函数打包元素实例解析
2019/12/11 Python
python中count函数简单用法
2020/01/05 Python
浅析Python面向对象编程
2020/07/10 Python
html5中canvas学习笔记1-画板的尺寸与实际显示尺寸
2013/01/06 HTML / CSS
实习生自荐信范文
2013/11/13 职场文书
调解员先进事迹材料
2014/02/07 职场文书
期终自我鉴定
2014/02/17 职场文书
法制宣传实施方案
2014/03/13 职场文书
三八妇女节活动总结
2014/05/04 职场文书
2014大学生批评与自我批评思想汇报
2014/09/21 职场文书
canvas多重阴影发光效果实现
2021/04/20 Javascript
Go语言 详解net的tcp服务
2022/04/14 Golang