전체 네트워크 애플릿 인터페이스 요청 봉인 실례 코드

앞말
이 글은 주로 일부 초보자를 겨냥하여 쓴 것이 좋지 않은 점이 있으니, 여러분 많은 양해를 바랍니다.
utils 폴더에 js 파일 두 개를 새로 만듭니다. 하나는api입니다.js, 하나는requtil입니다.js
api.js
이 파일은 주api 인터페이스로 쓸데없는 말은 하지 않고 바로 코드가 뜬다

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
위챗의 wx.request 요청 분리 봉인

const globalsetting = require('globalsetting.js')
const baseURL = globalsetting.server
const 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：
 ')
 } else if(status == 404) {
  util.errorMsg(' 404：
 ')
 }
 if(callback) callback(rs.data)
 }
}

function fail(callback) {
 return function(rs) {
 console.log(rs)
 if(callback) callback(rs)
 }
}
//  token
function _setToken(tk) {
 token = tk
 wx.setStorageSync('token', token)
}

페이지 호출 방법
전역 앱.안에

import api from './utils/apis.js';
App({
	api: api,
})

index 페이지
getApp () 를 통해api 인터페이스를 가져오고, 사용자 정의 함수에서promise 방법으로 데이터를 가져오고, getDevList에서 getChatRecord 방법을 호출하면 데이터 값을 부여할 수 있습니다

const APP = getApp()
getDevList(e){
 this.getChatRecord().then(res => {
 wx.hideLoading({
  success: (res) => {},
 });
 if(res.id == '-1') {
  utils.errorMsg(res.message);
 }else {
  console.log(res)
 }
 })
}
//  
getChatRecord (params = {}) {
 return new Promise((resolve, reject) => {
 APP.api.getDeviceList({
  success: res => {
  resolve(res)
  }
 })
 })
},

후기에 데모를 만들어서 github 위에 올려놓을게요. 이렇게 하면 더 직관적으로 보일 거예요.
총결산
이 글은 인터넷 소프로그램 인터페이스 요청 봉인 실례에 대한 소개입니다. 더 많은 인터넷 소프로그램 인터페이스 요청 봉인 내용은 저희 이전의 글을 검색하거나 아래의 관련 글을 계속 훑어보십시오. 앞으로 많은 응원 부탁드립니다!