微信小程序封装api接口方法教程

微信小程序封装api接口

一.在until文件夹下面创建api.js和http.js(文件名可以自定义,后期引入的时候要注意)

2.在http.js里面写一下公共域名,请求方式等,需要再api.js里引用(以下代码复制即刻,需改一下域名)

module.exports = {http(url, method, params) {let token = 'token' // 获取token，自行获取token和签名，token和签名表示每个接口都要发送的数据let sign = 'sign' // 获取签名 (后台怎么定义的，就传什么)let data = {token,sign}if (params.data) { // 在这里判断一下data是否存在，params表示前端需要传递的数据，params是一个对象，有三组键值对，data：表示请求要发送的数据，success：成功的回调，fail：失败的回调，这三个字段可缺可无，其余字段会忽略for (let key in params.data) { // 在这里判断传过来的参数值为null，就删除这个属性if (params.data[key] == null || params.data[key] == 'null') {delete params.data[key]}}data = { ...data, ...params.data }}wx.request({url: '域名' + url, // 就是拼接上前缀,此接口域名是开放接口，可访问method: method == 'post' ? 'post' : 'get', // 判断请求类型，除了值等于'post'外，其余值均视作get 其他的请求类型也可以自己加上的data,header: {'content-type': 'application/json'},success(res) {params.success && params.success(res.data)},fail(err) {params.fail && params.fail(err)}})}
}

3.在api.js里面要定义接口,管理所以接口.便于维护,在该文件中需引入http.js文件(以下代码复制即刻)

// 在这里面定义所有接口，一个文件管理所有接口，易于维护
import { http } from './http'; // 引入刚刚封装好的http模块，import属于ES6的语法，微信开发者工具必须打开ES6转ES5选项function femaleNameApi(params) { // 请求***接口http('/getDate', 'get', params)  // 接口请求的路由地址以及请求方法在此处传递
}// 每一个接口定义一个函数，然后暴露出去，供逻辑代码调用function novelApi(params) { // 请求***接口http('/novelApi', 'get', params)
}export default { // 暴露接口femaleNameApi,novelApi
}

4.在相对应的文件里面调用api.js文件

如有疑问敬请留言评论!

微信小程序封装api接口方法教程相关推荐

微信小程序封装api请求步骤
小程序发起网络请求需用到 wx.request() 废话不多说直接开始封装 1.首先创建一个request文件夹里边创建一个api.js和request.js 2.封装的请求在request.js ...
微信小程序之 ----API接口
1. wx.request 接口可在文件 wxs中操作,连接服务器处理数据参数 ① url ② data ③ header ④ method ⑤ dataType 回调 success, fail ...
微信小程序商标查询API接口源码
最近很多人要微信商标查询小程序. 小程序前端开发是很简单的事情,2天搞定,不能多了. 但后端的东西比较麻烦,单靠个人开发到上线至少需要半年以上时间. 关商标的数据包格式错乱就整了1个月,这个错乱不是统 ...
微信小程序服务器api接口的路径,微信小程序-封装请求基准路径、接口API 和使用...
1.在文件夹utils下新建 request.js文件 2.封装请求代码 // 基准路径 //路径仅为举例 const baseurl ='https://127.0.0.1' //get请求 fun ...
微信小程序之获取接口数据展示
上篇说到获取编辑框文本,没看过去看看. 本片介绍简单的接口数据获取,并且展示,采取模拟数据,拉取数据方式方法.文章最后附上DEMO 本篇暂未考虑美化问题,只看功能.如图: 一.简单介绍 1> w ...
微信小程序开发导航：精品教程+网友观点+demo源码（5月9日更新）
1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=1476434678461 2:简易教程:https://mp.weixin.qq.com/debu ...
微信小程序快递java_java调用微信小程序统一下单接口
java调用微信小程序统一下单接口今天项目中对接微信支付这一块,记录一下这是对接微信支付的开发文档地址微信支付流程流程分析: 我们可以看到,前端人员只用给我们一个code,我们通过code去获 ...
【小程序】微信小程序云开发笔记详细教程（建议收藏）
1- 前言 1.1 微信云开发是什么? 微信云开发是微信团队联合腾讯云推出的专业的小程序开发服务. 开发者可以使用云开发快速开发小程序.小游戏.公众号网页等,并且原生打通微信开放能力. 开发者无需搭建 ...
小程序setdata优化_微信小程序 setData的使用方法详解
微信小程序 setData的使用方法详解微信小程序 setData的使用方法详解最近在使用微信小程序的setData时,遇到了以下问题.如下: 官网文档在使用setData()设置数组对象的某个元 ...
【微信小程序控制硬件第12篇-项目篇】微信小程序蓝牙控制硬件应如何开始动手？为您全面解析微信小程序蓝牙API的使用；（附带demo）
[微信小程序控制硬件第1篇 ] 全网首发,借助 emq 消息服务器带你如何搭建微信小程序的mqtt服务器,轻松控制智能硬件! [微信小程序控制硬件第2篇 ] 开始微信小程序之旅,导入小程序Mqtt客户 ...

微信小程序封装api接口方法教程

微信小程序封装api接口

微信小程序封装api接口方法教程相关推荐

最新文章

热门文章