小程序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 相关文章推荐
Javascript在IE和FireFox中的不同表现简析
Dec 03 Javascript
js固定DIV高度,超出部分自动添加滚动条的简单方法
Jul 10 Javascript
jquery如何判断某元素是否具备指定的样式
Nov 05 Javascript
JS动态调用方法名示例介绍
Dec 18 Javascript
jQuery+css3实现Ajax点击后动态删除功能的方法
Aug 10 Javascript
详解webpack 配合babel 将es6转成es5 超简单实例
May 02 Javascript
React-Native中props具体使用详解
Sep 04 Javascript
基于jquery实现五星好评
Nov 18 jQuery
bootstrap中的导航条实例代码详解
May 20 Javascript
浅谈JavaScript中this的指向问题
Jul 28 Javascript
Vue 构造选项 - 进阶使用说明
Aug 14 Javascript
vue点击按钮实现简单页面的切换
Sep 08 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
解析PHP自带的进位制之间的转换函数
2013/06/08 PHP
PHP的Laravel框架中使用AdminLTE模板来编写网站后台界面
2016/03/21 PHP
php 自定义错误日志实例详解
2016/11/12 PHP
json对象转字符串如何实现
2012/12/02 Javascript
JQuery入门——用bind方法绑定事件处理函数应用介绍
2013/02/05 Javascript
js onclick事件传参讲解
2013/11/06 Javascript
JQuery设置时间段下拉选择实例
2014/12/30 Javascript
Jquery 全选反选实例代码
2015/11/19 Javascript
WebGL利用FBO完成立方体贴图效果完整实例(附demo源码下载)
2016/01/26 Javascript
JavaScript黑洞数字之运算路线查找算法(递归算法)实例
2016/01/28 Javascript
JavaScript实现反转字符串的方法详解
2017/04/27 Javascript
微信小程序 input输入及动态设置按钮的实现
2017/10/27 Javascript
vue cli使用绝对路径引用图片问题的解决
2017/12/06 Javascript
JS实现登录页密码的显示和隐藏功能
2017/12/06 Javascript
JS使用队列对数组排列,基数排序算法示例
2019/03/02 Javascript
JavaScript之数组扁平化详解
2019/06/03 Javascript
vue项目接口管理,所有接口都在apis文件夹中统一管理操作
2020/08/13 Javascript
Vue如何实现变量表达式选择器
2021/02/18 Vue.js
一些Centos Python 生产环境的部署命令(推荐)
2018/05/07 Python
Pandas 数据处理,数据清洗详解
2018/07/10 Python
python pptx复制指定页的ppt教程
2020/02/14 Python
Python读写压缩文件的方法
2020/07/30 Python
牧马人澳大利亚官网:Wrangler澳大利亚
2019/10/08 全球购物
Nasty Gal英国:美国女性服饰销售网站
2021/03/02 全球购物
Linux如何压缩可执行文件
2013/10/21 面试题
经济信息系毕业生自荐信范文
2014/03/15 职场文书
中国梦团日活动总结
2014/07/07 职场文书
绿色环保家庭事迹材料
2014/08/31 职场文书
国家机关领导干部民主生活会对照检查材料思想汇报
2014/09/17 职场文书
群众路线学习心得体会范文
2014/11/05 职场文书
护士2015年终工作总结
2015/04/29 职场文书
房产遗嘱范本
2015/08/06 职场文书
期中考试后的感想
2015/08/07 职场文书
事业单位岗位说明书
2015/10/08 职场文书
python 远程执行命令的详细代码
2022/02/15 Python
利用For循环遍历Python字典的三种方法实例
2022/03/25 Python