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


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 相关文章推荐
学习JavaScript编程语言的8张思维导图分享
Mar 27 Javascript
jquery对复选框(checkbox)的操作汇总
Jan 13 Javascript
网页瀑布流布局jQuery实现代码
Oct 21 Javascript
JavaScript之DOM_动力节点Java学院整理
Jul 03 Javascript
javascript 开发之网页兼容各种浏览器
Sep 28 Javascript
详解bootstrap导航栏.nav与.navbar区别
Nov 23 Javascript
微信小程序实现YDUI的ScrollNav组件
Feb 02 Javascript
vue的安装及element组件的安装方法
Mar 09 Javascript
angular2/ionic2 实现搜索结果中的搜索关键字高亮的示例
Aug 17 Javascript
JavaScript日期工具类DateUtils定义与用法示例
Sep 03 Javascript
vue-cli脚手架打包静态资源请求出错的原因与解决
Jun 06 Javascript
VSCode 配置uni-app的方法
Jul 11 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
一个ubbcode的函数,速度很快.
2006/10/09 PHP
php获取某个目录大小的代码
2008/09/10 PHP
判断是否为指定长度内字符串的php函数
2010/02/16 PHP
php中让上传的文件大小在上传前就受限制的两种解决方法
2013/06/24 PHP
php根据年月获取季度的方法
2014/03/31 PHP
thinkphp5.1框架容器与依赖注入实例分析
2019/07/23 PHP
一个加载js文件的小脚本
2007/06/28 Javascript
javascript 当前日期加(天、周、月、年)
2009/08/09 Javascript
Javascript学习笔记6 prototype的提出
2010/01/11 Javascript
获取客户端网卡MAC地址和IP地址实现JS代码
2013/03/17 Javascript
简单实现JS对dom操作封装
2015/12/02 Javascript
JavaScript根据CSS的Media Queries来判断浏览设备的方法
2016/05/10 Javascript
Bootstrap中文本框的宽度变窄并且加入一副验证码图片的实现方法
2016/06/23 Javascript
angularjs实现文字上下无缝滚动特效代码
2016/09/04 Javascript
AngularJS equal比较对象实例详解
2016/09/14 Javascript
JS实现含有中文字符串的友好截取功能分析
2017/03/13 Javascript
canvas基础绘制-绚丽倒计时的实例
2017/09/17 Javascript
js运算符的一些特殊用法
2018/07/29 Javascript
jquery使用FormData实现异步上传文件
2018/10/25 jQuery
一秒学会微信小程序制作table表格
2019/02/14 Javascript
koa+jwt实现token验证与刷新功能
2019/05/30 Javascript
在vue中使用inheritAttrs实现组件的扩展性介绍
2020/12/07 Vue.js
[50:27]OG vs LGD 2018国际邀请赛淘汰赛BO3 第一场 8.26
2018/08/30 DOTA
Python闭包实现计数器的方法
2015/05/05 Python
python环形单链表的约瑟夫问题详解
2018/09/27 Python
Python中文件的写入读取以及附加文字方法
2019/01/23 Python
Django 用户认证组件使用详解
2019/07/23 Python
详解python中的三种命令行模块(sys.argv,argparse,click)
2020/12/15 Python
python线程优先级队列知识点总结
2021/02/28 Python
欧洲最大的滑雪假期供应商之一:Sunweb Holidays
2018/01/06 全球购物
Tod’s英国官方网站:意大利奢华手工制作手袋和鞋履
2019/03/15 全球购物
欧缇丽加拿大官方网站:Caudalie加拿大
2019/07/18 全球购物
员工晚婚的请假条
2014/02/08 职场文书
预备党员转正材料
2014/12/19 职场文书
2015年员工试用期工作总结
2015/05/28 职场文书
html用代码制作虚线框怎么做? dw制作虚线圆圈的技巧
2022/12/24 HTML / CSS