小程序Request的另类用法详解


Posted in Javascript onAugust 09, 2019

前言

小程序中唯一能发送网络请求接口数据的是wx.request接口,当然这个接口存在诸多的限制,例如:10个并发请求限制,https限制(当然在开发阶段是可以关闭此限制),除了wx.request还有其他方法可以实现类型的功能吗?当然是有的,这个思路也源于我之前看到的一篇文章,随便笔记下来

思路

使用云开发来发送网络请求并把数据返回给小程序端。还不了解的云开发的同学请速度移步到官方【云开发】
新建一个http的云函数

// 云函数入口文件
const cloud = require('wx-server-sdk')
const axios = require('axios')
cloud.init()
// 云函数入口函数
exports.main = async (event, context) => {
 const wxContext = cloud.getWXContext()
 const { method, url, data } = event;
 const res = await axios.request({
  method: method,
  url: url,
  data: data
 });
 return { code: 1, data: res.data } || {code: -1, msg: 'error', data: null}
}

小程序端二次封装云函数调用

async http(options = {}) {
  return wx.cloud.callFunction({
    name: 'http',
    data: {
      method: options.method || 'GET',
      url: options.url || '',
      data: options.data || {}
    }
  }).then(res => {
    return res.result
  })
},

小程序端使用

async onLoad() {
  this.http({
   method: 'GET',
   url: 'https://www.baidu.com'
  }).then(res => {
   console.log(res)
  })
 },

总结

这种方法可以很好绕过https的限制,当然这只是提供一个简单的思路,我们可以进一步细一点封装,包括配置header proxy 等等功能,其实原理就是借助云函数做了二次转发,性能上肯定比不上原生的request

注意

async 和 await 语法糖在最新的开发工具中已经实现了,开启增强编译即可使用,具体更新内容请移步官方社区 微信小程序社区

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

Javascript 相关文章推荐
用JQuery实现表格隔行变色和突出显示当前行的代码
Feb 10 Javascript
jsonp原理及使用
Oct 28 Javascript
淘宝网提供的国内NPM镜像简介和使用方法
Apr 17 Javascript
微信小程序开发之选项卡(窗口底部TabBar)页面切换
Apr 12 Javascript
原生js FileReader对象实现图片上传本地预览效果
Mar 27 Javascript
vue组件学习教程
Sep 09 Javascript
vue中的event bus非父子组件通信解析
Oct 27 Javascript
JavaScript常见事件处理程序实例总结
Jan 05 Javascript
详解vue使用$http服务端收不到参数
Apr 19 Javascript
vue 实现搜索的结果页面支持全选与取消全选功能
May 10 Javascript
bootstrap table列和表头对不齐的解决方法
Jul 19 Javascript
JavaScript JSON使用原理及注意事项
Jul 30 Javascript
一篇文章弄懂javascript中的执行栈与执行上下文
Aug 09 #Javascript
vue中组件通信的八种方式(值得收藏!)
Aug 09 #Javascript
Vue全局loading及错误提示的思路与实现
Aug 09 #Javascript
使用Vue CLI创建typescript项目的方法
Aug 09 #Javascript
详解vue beforeRouteEnter 异步获取数据给实例问题
Aug 09 #Javascript
微信小程序如何连接Java后台
Aug 08 #Javascript
vue 实现Web端的定位功能 获取经纬度
Aug 08 #Javascript
You might like
Yii使用CLinkPager分页实例详解
2014/07/23 PHP
php中define用法实例
2015/07/30 PHP
PHP中SSO Cookie登录分析和实现
2015/11/06 PHP
通过代码实例解析PHP session工作原理
2020/12/11 PHP
原型方法的不同写法居然会影响调试的解决方法
2007/03/08 Javascript
js 变量类型转换常用函数与代码[比较全]
2009/12/01 Javascript
js的toUpperCase方法用法实例
2015/01/27 Javascript
JavaScript 匿名函数和闭包介绍
2015/04/13 Javascript
jQuery验证插件validate使用详解
2016/05/11 Javascript
javascript 判断是否是微信浏览器的方法
2016/10/09 Javascript
使用jquery如何获取时间
2016/10/13 Javascript
基于jquery二维码生成插件qrcode
2017/01/07 Javascript
bootstrap datetimepicker 日期插件在火狐下出现一条报错信息的原因分析及解决办法
2017/03/08 Javascript
微信小程序 图片宽度自适应的实现
2017/04/06 Javascript
详解Angular 中 ngOnInit 和 constructor 使用场景
2017/06/22 Javascript
React Native实现地址挑选器功能
2017/10/24 Javascript
Angular4学习之Angular CLI的安装与使用教程
2018/01/04 Javascript
详解几十行代码实现一个vue的状态管理
2019/01/28 Javascript
node.js express框架实现文件上传与下载功能实例详解
2019/10/15 Javascript
小程序实现按下录音松开识别语音
2019/11/22 Javascript
一则python3的简单爬虫代码
2014/05/26 Python
Python3基础之函数用法
2014/08/13 Python
Python中的zipfile模块使用详解
2015/06/25 Python
Python3.7实现中控考勤机自动连接
2018/08/28 Python
python Plotly绘图工具的简单使用
2020/03/03 Python
Selenium常见异常解析及解决方案示范
2020/04/10 Python
Python2与Python3关于字符串编码处理的差别总结
2020/09/07 Python
如何完美的建立一个python项目
2020/10/09 Python
python语言实现贪吃蛇游戏
2020/11/13 Python
python中openpyxl和xlsxwriter对Excel的操作方法
2021/03/01 Python
Roxy荷兰官方网站:冲浪、滑雪板、服装和配件
2019/10/22 全球购物
3D空间设计学生找工作的自我评价
2013/10/28 职场文书
批评与自我批评材料
2014/02/15 职场文书
优秀教师自我评价范文
2014/09/27 职场文书
2014年安全管理工作总结
2014/12/01 职场文书
领导激励员工的演讲稿,各种会上用得到,建议收藏
2019/08/13 职场文书