Inhaltsverzeichnis
api.js
requtil.js
Ich werde später eine Demo erstellen und sie auf Github stellen, damit Sie sie intuitiver sehen können
Verwandte kostenlose Lernempfehlung:
Heim WeChat-Applet Mini-Programmentwicklung Das gesamte Netzwerk stellt das Beispiel der Mini-Programmschnittstellen-Anforderungskapselung vor

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

Oct 14, 2020 pm 05:50 PM

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
}复制代码
Nach dem Login kopieren

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)
}复制代码
Nach dem Login kopieren

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!

Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

AI Hentai Generator

AI Hentai Generator

Erstellen Sie kostenlos Ai Hentai.

Heißer Artikel

R.E.P.O. Energiekristalle erklärten und was sie tun (gelber Kristall)
3 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Beste grafische Einstellungen
3 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. So reparieren Sie Audio, wenn Sie niemanden hören können
3 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
WWE 2K25: Wie man alles in Myrise freischaltet
4 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌

Heiße Werkzeuge

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)