微信小程序使用request网络请求操作实例


Posted in Javascript onDecember 15, 2017

本文实例讲述了微信小程序使用request网络请求操作。分享给大家供大家参考,具体如下:

小程序提供了很多api,极大的方便了开发者,其中网络请求api是wx.request(object),这是小程序与开发者的服务器实现数据交互的一个很重要的api。

官方参数说明如下

OBJECT参数说明:

参数名 类型 必填 说明
url String 开发者服务器接口地址
data Object、String 请求的参数
header Object 设置请求的 header , header 中不能设置 Referer
method String 默认为 GET,有效值:OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT
success Function 收到开发者服务成功返回的回调函数,res = {data: '开发者服务器返回的内容'}
fail Function 接口调用失败的回调函数
complete Function 接口调用结束的回调函数(调用成功、失败都会执行)

最简单的用法如下(以POST请求为例)

bindSearchChange:function(e){
 var keyword = e.detail.value;
 wx.request({
 url:'xxxxxxxxx',
 data:{},
 header: {'Content-Type': 'application/json'},
 success: function(res) {
 console.log(res)
 }
 })
}

下面我们把请求写在service文件下的http.js文件中,代码如下

var rootDocment = 'hxxxxx';//你的域名
function req(url,data,cb){
 wx.request({
 url: rootDocment + url,
 data: data,
 method: 'post',
 header: {'Content-Type': 'application/json'},
 success: function(res){
 return typeof cb == "function" && cb(res.data)
 },
 fail: function(){
 return typeof cb == "function" && cb(false)
 }
 })
}
module.exports = {
 req: req
}

其中module.exports是将req方法暴露出去使得别的文件中可以使用该方法,由于js函数是异步执行的,所以return 的是回调函数,而不是具体的数据

为了其他文件方便调用此方法,我们在根目录的app.js文件中将其注册成为全局函数,如下

//app.js
var http = require('service/http.js')
App({
 onLaunch: function () {
 //调用API从本地缓存中获取数据
 var logs = wx.getStorageSync('logs') || []
 logs.unshift(Date.now())
 wx.setStorageSync('logs', logs)
 },
 getUserInfo:function(cb){
 var that = this
 if(this.globalData.userInfo){
 typeof cb == "function" && cb(this.globalData.userInfo)
 }else{
 //调用登录接口
 wx.login({
 success: function () {
  wx.getUserInfo({
  success: function (res) {
  that.globalData.userInfo = res.userInfo
  typeof cb == "function" && cb(that.globalData.userInfo)
  }
  })
 }
 })
 }
 },
 globalData:{
 userInfo:null
 },
 func:{
 req:http.req
 }
})

这时这个req就是全局的了,在调用时我们可以使用getApp.func.req()来调用,具体如下

var app = getApp()
Page({
 data: {
 },
 onLoad: function (opt) {
 //console.log(opt.name)
 app.func.req('/api/get_data',{},function(res){
 console.log(res)
 });
 }
})

微信小程序提供了很多api,包括网络,媒体,数据等,也提供了很多组件,使开发小程序变得很方便。

希望本文所述对大家微信小程序开发有所帮助。

Javascript 相关文章推荐
用javascript来实现动画导航效果的代码
Dec 16 Javascript
JQuery与iframe交互实现代码
Dec 24 Javascript
善用事件代理,警惕闭包的性能陷阱。
Jan 20 Javascript
jQuery瀑布流插件Wookmark使用实例
Apr 02 Javascript
jQuery读取XML文件内容的方法
Mar 09 Javascript
jQuery validate+artdialog+jquery form实现弹出表单思路详解
Apr 18 Javascript
js css3实现图片拖拽效果
Mar 04 Javascript
微信小程序 页面滑动事件的实例详解
Oct 12 Javascript
微信小程序实现slideUp、slideDown滑动效果及点击空白隐藏功能示例
Dec 11 Javascript
ES6 class的应用实例分析
Jun 27 Javascript
IE11下处理Promise及Vue的单项数据流问题
Jul 24 Javascript
微信小程序实现天气预报功能(附源码)
Dec 10 Javascript
VS Code转换大小写、修改选中文字或代码颜色的方法
Dec 15 #Javascript
Angular中管道操作符(|)的使用方法
Dec 15 #Javascript
浅谈Vue SPA 首屏加载优化实践
Dec 15 #Javascript
利用VS Code开发你的第一个AngularJS 2应用程序
Dec 15 #Javascript
Angular2开发环境搭建教程之VS Code
Dec 15 #Javascript
JavaScript原生实现观察者模式的示例
Dec 15 #Javascript
基于javascript 显式转换与隐式转换(详解)
Dec 15 #Javascript
You might like
PHP中文URL编解码(urlencode()rawurlencode()
2010/07/03 PHP
PHP实现基于mysqli的Model基类完整实例
2016/04/08 PHP
使用ltrace工具跟踪PHP库函数调用的方法
2016/04/25 PHP
详解PHP版本兼容之openssl调用参数
2018/07/25 PHP
PHP中非常有用却鲜有人知的函数集锦
2019/08/17 PHP
jQuery 获取对象 定位子对象
2010/05/31 Javascript
JavaScript编程开发中的五个实用小技巧
2010/07/22 Javascript
javascript学习基础笔记之DOM对象操作
2011/11/03 Javascript
基于jquery完美拖拽,可返回拖动轨迹
2012/03/29 Javascript
js 模式窗口(模式对话框和非模式对话框)的使用介绍
2014/07/17 Javascript
JS函数arguments数组获得实际传参数个数的实现方法
2016/05/28 Javascript
对于js垃圾回收机制的理解
2017/09/14 Javascript
vue项目优化之通过keep-alive数据缓存的方法
2017/12/11 Javascript
jQuery实现文件编码成base64并通过AJAX上传的方法
2018/04/12 jQuery
jQuery实现弹出层效果
2019/12/10 jQuery
在漏洞利用Python代码真的很爽
2007/08/26 Python
Python中用startswith()函数判断字符串开头的教程
2015/04/07 Python
Python实现遍历目录的方法【测试可用】
2017/03/22 Python
Python中Django 后台自定义表单控件
2017/03/28 Python
单利模式及python实现方式详解
2018/03/20 Python
Pycharm更换python解释器的方法
2018/10/29 Python
Python列表删除元素del、pop()和remove()的区别小结
2019/09/11 Python
Python 读取WAV音频文件 画频谱的实例
2020/03/14 Python
全天然狗零食:Best Bully Sticks
2016/09/22 全球购物
KLOOK客路:发现更好玩的世界,预订独一无二的旅行体验
2016/12/16 全球购物
什么是.net的Remoting技术
2016/07/08 面试题
职业教育毕业生求职信
2013/11/09 职场文书
业务代表的岗位职责
2013/11/16 职场文书
经典优秀毕业生求职信范文分享
2013/12/18 职场文书
给校长的一封建议书
2014/03/12 职场文书
初中新生军训方案
2014/05/13 职场文书
大学毕业生求职自荐书
2014/06/05 职场文书
甜品店创业计划书
2014/09/21 职场文书
逃出克隆岛观后感
2015/06/09 职场文书
小学运动会入场口号
2015/12/24 职场文书
800字作文之大雪
2019/12/04 职场文书