Heim  >  Artikel  >  WeChat-Applet  >  Das gesamte Netzwerk stellt das Beispiel der Mini-Programmschnittstellen-Anforderungskapselung vor

Das gesamte Netzwerk stellt das Beispiel der Mini-Programmschnittstellen-Anforderungskapselung vor

coldplay.xixi
coldplay.xixinach vorne
2020-10-14 17:50:572349Durchsuche

Tutorial zur Entwicklung von MiniprogrammenHeute stelle ich Ihnen alle Beispiele für die Kapselung von Miniprogrammschnittstellenanforderungen im gesamten Netzwerk vor. Kommen Sie und schauen Sie zu.

Das gesamte Netzwerk stellt das Beispiel der Mini-Programmschnittstellen-Anforderungskapselung vor

Dieser Artikel ist hauptsächlich für Anfänger gedacht, wenn es einige schlechte Texte gibt, bitte verzeihen Sie mir!

Erstellen Sie zwei neue js-Dateien im Ordner utils, eine ist api.js und die andere ist requtil.js

api.js

Diese Datei ist die Haupt-API-Schnittstelle. Kommen wir ohne weitere Umschweife direkt zum Code

const request = require('requtil.js')/*Apis 把全部api都存在这里*/const Apis = { 
   /* 用户相关 */
  'login': '/devicecenter/auth/weChtLoin',  'bindUser': '/devicecenter/user/userBindinOpenId',  'genQrCode': '/devicecenter/user/getUserRcode',  
   /* 设备相关 */
  'getDeviceList': '/minipro/group/getDl', // 获取设备列表
  'getDeviceAdd': '/minipro/group/addDl', //  添加设备
  'getDeviceDtl': '/minipro/group/delDl', //  删除设备}/* 定义请求方法 */const user = {  login: function(data) {
    request.get(Apis.login, data)
  },  getSecret: function(data) {
    request.get(Apis.getSecret, data)
  },
}module.exports = {
  ...user
}复制代码

requtil.js

Kapselt separat die wx.request-Anfrage von WeChat API-Schnittstelle über getApp() und passen Sie es an Eine Promise-Methode wird in einer Funktion verwendet, um Daten abzurufen, und dann wird die getChatRecord-Methode in getDevList aufgerufen, um Daten zuzuweisen

const globalsetting = require('globalsetting.js')const baseURL = globalsetting.serverconst util = require('util.js')const ignoreUrls = [  '/auth/weChatLogin',  '/user/userBindingOpenId',  '/user/getSecret',  '/user/getOpenId']var token = ''function post(url, args) {
  args = _prev(url, 'POST', args)
  wx.request(args)
}function get(url, args) {
  args = _prev(url, 'GET', args)
  wx.request(args)
}function put(url, args) {
  args = _prev(url, 'PUT', args)
  wx.request(args)
}function _delete(url, args) {
  args = _prev(url, 'DELETE', args)
  wx.request(args)
}function _prev(url, method, args) {  // console.log('123',args)
  args = args || {}
  args.url = url  if(args.urlparam) 
    args.url += '/' + args.urlparam  var params = parseParams(args)
  params.method = method
  params.success = success(params.success)
  params.fail = fail(params.fail)
  setToken(params)  return params
}// 处理接口是否需要添加header.token方法function setToken(params) {  if (!ignoreUrls.some(url => params.url.match(new RegExp(url)))) {    if (!params.header)
      params.header = { token: getToken() }    else 
      params.header.token = getToken()
  } else {    // console.log('ignore: ', params.url)
  }
}// 处理接口参数方法function parseParams(args) {  var params = Object.assign(args)  if (!(params.url.startsWith('https://') || params.url.startsWith('http://')))
    params.url = baseURL + params.url  if(params.param) {    if (params.url.indexOf('?') > -1 && params.url.indexOf('?') != params.url.length - 1) {
      params.url += '&' 
    } else if(params.url.indexOf('?') == params.url.length -1) {      // 无任何操作
    } else {
      params.url += '?'
    }    var buf = ''
    for(var name in params.param) {      let val = params.param[name];
      buf += name + '=' + encodeURI(typeof val == 'object' ? JSON.stringify(val) : val) + '&'
    }
    params.url += buf
  }  return params
}// 接口返回成功方法function success(callback) {  return function(rs) {    var status = rs.statusCode    if (status == 405) {
      util.errorMsg('请求失败405:\n服务器返回失败')
    } else if(status == 404) {
      util.errorMsg('请求失败404:\n找不到接口')
    }    if(callback) callback(rs.data)
  }
}function fail(callback) {  return function(rs) {    console.log(rs)    if(callback) callback(rs)
  }
}// 获取接口请求回来的tokenfunction _setToken(tk) {
  token = tk
  wx.setStorageSync('token', token)
}复制代码

Ich werde später eine Demo erstellen und sie auf Github stellen, damit Sie sie intuitiver sehen können

Verwandte kostenlose Lernempfehlung:

Mini-Tutorial zur Programmentwicklung

Das obige ist der detaillierte Inhalt vonDas gesamte Netzwerk stellt das Beispiel der Mini-Programmschnittstellen-Anforderungskapselung vor. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Dieser Artikel ist reproduziert unter:juejin.im. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen