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


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库 开发规则
Jan 31 Javascript
有效的捕获JavaScript焦点的方法小结
Oct 08 Javascript
defer属性导致引用JQuery的页面报“浏览器无法打开网站xxx,操作被中止”错误的解决方法
Apr 27 Javascript
Jquery中CSS选择器用法分析
Feb 10 Javascript
jQuery中JSONP的两种实现方式详解
Sep 26 Javascript
原生JS京东轮播图代码
Mar 22 Javascript
jquery实现静态搜索功能(可输入搜索文字)
Mar 28 jQuery
jquery获取链接地址和跳转详解(推荐)
Aug 15 jQuery
基于JavaScript实现简单的音频播放功能
Jan 07 Javascript
Vue2 轮播图slide组件实例代码
May 31 Javascript
Vue递归实现树形菜单方法实例
Nov 06 Javascript
基于JavaScript伪随机正态分布代码实例
Nov 07 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
德劲1103的维修打理经验
2021/03/02 无线电
php使用fputcsv()函数csv文件读写数据的方法
2015/01/06 PHP
PHP调用.NET的WebService 简单实例
2015/03/27 PHP
Yii框架使用PHPExcel导出Excel文件的方法分析【改进版】
2019/07/24 PHP
js变量作用域及可访问性的探讨
2006/11/23 Javascript
获取Javscript执行函数名称的方法
2006/12/22 Javascript
基于jquery的跨域调用文件
2010/11/19 Javascript
html+javascript实现可拖动可提交的弹出层对话框效果
2013/08/05 Javascript
jQuery获取和设置表单元素的方法
2014/02/14 Javascript
详谈nodejs异步编程
2014/12/04 NodeJs
js正则表达式中exec用法实例
2015/07/23 Javascript
JS排序之冒泡排序详解
2017/04/08 Javascript
详解vue.js 开发环境搭建最简单攻略
2017/06/12 Javascript
JavaScript创建对象的常用方式总结
2018/08/10 Javascript
VUE搭建手机商城心得和遇到的坑
2019/02/21 Javascript
Vue中computed、methods与watch的区别总结
2019/04/10 Javascript
详解Vue依赖收集引发的问题
2019/04/22 Javascript
vue项目配置 webpack-obfuscator 进行代码加密混淆的实现
2021/02/26 Vue.js
python 调用有道api接口的方法
2019/01/03 Python
详解Python解决抓取内容乱码问题(decode和encode解码)
2019/03/29 Python
使用Keras加载含有自定义层或函数的模型操作
2020/06/10 Python
python语言time库和datetime库基本使用详解
2020/12/25 Python
HTML5 Canvas draw方法制作动画效果示例
2013/07/11 HTML / CSS
施华洛世奇波兰官网:SWAROVSKI波兰
2019/06/18 全球购物
电子商务专业推荐信范文
2013/12/02 职场文书
工厂厂长的职责
2013/12/12 职场文书
竞争性谈判邀请书
2014/02/06 职场文书
教学改革实施方案
2014/03/31 职场文书
个人课题方案
2014/05/08 职场文书
工程负责人任命书
2014/06/06 职场文书
庆祝教师节演讲稿
2014/09/03 职场文书
升职自荐信范文
2015/03/27 职场文书
投资合作意向书范本
2015/05/08 职场文书
python人工智能human learn绘图可创建机器学习模型
2021/11/23 Python
浅谈如何保证Mysql主从一致
2022/03/13 MySQL
php解析非标准json、非规范json的方式实例
2022/05/10 PHP