微信小程序封装api请求步骤

小程序发起网络请求需用到 wx.request()

废话不多说直接开始封装

1.首先创建一个request文件夹里边创建一个api.js和request.js

2.封装的请求在request.js 文件里，看代码

const URL = {develop: {// BASE_URL: "", //测试域名BASE_URL: "http://xxx.com:21408/lzt",  //这里写接口的地址前缀},trial: {// BASE_URL: "", //测试域名BASE_URL: "", //服务器域名},release: {// BASE_URL: "", //测试域名BASE_URL: "", //服务器域名}
}/*** GET请求封装*/
function get(url, data = {}) {return request(url, 'GET', data)
}/*** POST请求封装*/
function post(url, data = {}) {return request(url, 'POST', data)
}/*** @description 上传文件* @param {*} url 请求地址* @param {*} data 参数*/
function upLoad(url, data = {}) {return uploadFile(url, 'POST', data)
}/*** 微信的request*/
function request(url, method = "GET", data = {}) {var appSecret = "8800c670ccc54bb0a9724ff05549f208";   // 看个人需求这是我公司需要在请求头携带的参数值var clientId = "2c46c1e4f8954b54bb1b984efa06fab6";   // 看个人需求这是我公司需要在请求头携带的参数值var contentType = method == 'GET' ? 'application/json' : 'application/x-www-form-urlencoded; charset=utf-8'   // 这是大部分都是必须携带的。var getUrl = "http://xxxx.com:21408/lzt"+url;   // 请求的地址前缀加后期在api文件写的接口地址。getUrl = getUrl.indexOf('?') == -1?getUrl+"?":getUrl;if(method.toLocaleUpperCase() == "GET"){getUrl += (getUrl.charAt(getUrl.length-1) == "&"?"":"&") + "loginAreaId=" + zyUrl.getSiteID() + (userInfo?'&openId=' + userInfo.openid:'');}var signatureAppUrl = getUrl.split('/lzt')[0];// console.log(getUrl);var signatureUrl = getUrl.match(/lzt(\S*)\?/)[1];var signatureParam = getUrl.split('?')[1];var signatureTime = Date.parse(new Date()) / 1000;var signatureMessage = signatureTime + '-' + method.toLocaleUpperCase() + '-' + signatureUrl + '-' + getSignatureParam(method, signatureParam);var signatureHash = CryptoJS.HmacSHA256(signatureMessage, appSecret).toString();var header = { 'content-Type': contentType,  // 这个应该大部分公司都需要携带在请求头中把'timestamp': signatureTime, //看个人需求这是我公司需要在请求头携带的参数'u-login-areaId': '370200', //看个人需求这是我公司需要在请求头携带的参数'signature': signatureHash,  //看个人需求这是我公司需要在请求头携带的参数'clientId': clientId,  //看个人需求这是我公司需要在请求头携带的参数}// console.log(header);return new Promise(function (resolve, reject) {wx.request({url: URL[app.globalData.envVersion].BASE_URL + url,data: data,method: method,header: header,success: function (res) {resolve(res.data)},fail: function (err) {//服务器连接异常reject(err, "服务器连接异常，请检查网络再试")},})});
}// 以下是我公司用到的一些   你们不用的可以忽略以下两段代码function getSignatureParam(_httpMethod, _param) {if(_httpMethod.toLocaleUpperCase() != "GET"){return "0";}var jsonarr = _param.split("&");var signStr = '';for (var i in jsonarr) {var key = jsonarr[i].split("=")[0];var value = jsonarr[i].split("=")[1];if (key == 'timestamp' || key == 'clientId' || key == 'signature' ||　!value) {continue;}signStr += key;}if (!signStr) {return "0";}var paramIntValue = 0;for (var i = 0; i < signStr.length; i++) {paramIntValue += signStr.charCodeAt(i);}return paramIntValue;
}var CryptoJS=CryptoJS||function(h,s){var f={},g=f.lib={},q=function(){},m=g.Base={extend:function(a){q.prototype=this;var c=new q;a&&c.mixIn(a);c.hasOwnProperty("init")||(c.init=function(){c.$super.init.apply(this,arguments)});c.init.prototype=c;c.$super=this;return c},create:function(){var a=this.extend();a.init.apply(a,arguments);return a},init:function(){},mixIn:function(a){for(var c in a)a.hasOwnProperty(c)&&(this[c]=a[c]);a.hasOwnProperty("toString")&&(this.toString=a.toString)},clone:function(){return this.init.prototype.extend(this)}},
r=g.WordArray=m.extend({init:function(a,c){a=this.words=a||[];this.sigBytes=c!=s?c:4*a.length},toString:function(a){return(a||k).stringify(this)},concat:function(a){var c=this.words,d=a.words,b=this.sigBytes;a=a.sigBytes;this.clamp();if(b%4)for(var e=0;e<a;e++)c[b+e>>>2]|=(d[e>>>2]>>>24-8*(e%4)&255)<<24-8*((b+e)%4);else if(65535<d.length)for(e=0;e<a;e+=4)c[b+e>>>2]=d[e>>>2];else c.push.apply(c,d);this.sigBytes+=a;return this},clamp:function(){var a=this.words,c=this.sigBytes;a[c>>>2]&=4294967295<<
32-8*(c%4);a.length=h.ceil(c/4)},clone:function(){var a=m.clone.call(this);a.words=this.words.slice(0);return a},random:function(a){for(var c=[],d=0;d<a;d+=4)c.push(4294967296*h.random()|0);return new r.init(c,a)}}),l=f.enc={},k=l.Hex={stringify:function(a){var c=a.words;a=a.sigBytes;for(var d=[],b=0;b<a;b++){var e=c[b>>>2]>>>24-8*(b%4)&255;d.push((e>>>4).toString(16));d.push((e&15).toString(16))}return d.join("")},parse:function(a){for(var c=a.length,d=[],b=0;b<c;b+=2)d[b>>>3]|=parseInt(a.substr(b,
2),16)<<24-4*(b%8);return new r.init(d,c/2)}},n=l.Latin1={stringify:function(a){var c=a.words;a=a.sigBytes;for(var d=[],b=0;b<a;b++)d.push(String.fromCharCode(c[b>>>2]>>>24-8*(b%4)&255));return d.join("")},parse:function(a){for(var c=a.length,d=[],b=0;b<c;b++)d[b>>>2]|=(a.charCodeAt(b)&255)<<24-8*(b%4);return new r.init(d,c)}},j=l.Utf8={stringify:function(a){try{return decodeURIComponent(escape(n.stringify(a)))}catch(c){throw Error("Malformed UTF-8 data");}},parse:function(a){return n.parse(unescape(encodeURIComponent(a)))}},
u=g.BufferedBlockAlgorithm=m.extend({reset:function(){this._data=new r.init;this._nDataBytes=0},_append:function(a){"string"==typeof a&&(a=j.parse(a));this._data.concat(a);this._nDataBytes+=a.sigBytes},_process:function(a){var c=this._data,d=c.words,b=c.sigBytes,e=this.blockSize,f=b/(4*e),f=a?h.ceil(f):h.max((f|0)-this._minBufferSize,0);a=f*e;b=h.min(4*a,b);if(a){for(var g=0;g<a;g+=e)this._doProcessBlock(d,g);g=d.splice(0,a);c.sigBytes-=b}return new r.init(g,b)},clone:function(){var a=m.clone.call(this);
a._data=this._data.clone();return a},_minBufferSize:0});g.Hasher=u.extend({cfg:m.extend(),init:function(a){this.cfg=this.cfg.extend(a);this.reset()},reset:function(){u.reset.call(this);this._doReset()},update:function(a){this._append(a);this._process();return this},finalize:function(a){a&&this._append(a);return this._doFinalize()},blockSize:16,_createHelper:function(a){return function(c,d){return(new a.init(d)).finalize(c)}},_createHmacHelper:function(a){return function(c,d){return(new t.HMAC.init(a,
d)).finalize(c)}}});var t=f.algo={};return f}(Math);
(function(h){for(var s=CryptoJS,f=s.lib,g=f.WordArray,q=f.Hasher,f=s.algo,m=[],r=[],l=function(a){return 4294967296*(a-(a|0))|0},k=2,n=0;64>n;){var j;a:{j=k;for(var u=h.sqrt(j),t=2;t<=u;t++)if(!(j%t)){j=!1;break a}j=!0}j&&(8>n&&(m[n]=l(h.pow(k,0.5))),r[n]=l(h.pow(k,1/3)),n++);k++}var a=[],f=f.SHA256=q.extend({_doReset:function(){this._hash=new g.init(m.slice(0))},_doProcessBlock:function(c,d){for(var b=this._hash.words,e=b[0],f=b[1],g=b[2],j=b[3],h=b[4],m=b[5],n=b[6],q=b[7],p=0;64>p;p++){if(16>p)a[p]=
c[d+p]|0;else{var k=a[p-15],l=a[p-2];a[p]=((k<<25|k>>>7)^(k<<14|k>>>18)^k>>>3)+a[p-7]+((l<<15|l>>>17)^(l<<13|l>>>19)^l>>>10)+a[p-16]}k=q+((h<<26|h>>>6)^(h<<21|h>>>11)^(h<<7|h>>>25))+(h&m^~h&n)+r[p]+a[p];l=((e<<30|e>>>2)^(e<<19|e>>>13)^(e<<10|e>>>22))+(e&f^e&g^f&g);q=n;n=m;m=h;h=j+k|0;j=g;g=f;f=e;e=k+l|0}b[0]=b[0]+e|0;b[1]=b[1]+f|0;b[2]=b[2]+g|0;b[3]=b[3]+j|0;b[4]=b[4]+h|0;b[5]=b[5]+m|0;b[6]=b[6]+n|0;b[7]=b[7]+q|0},_doFinalize:function(){var a=this._data,d=a.words,b=8*this._nDataBytes,e=8*a.sigBytes;
d[e>>>5]|=128<<24-e%32;d[(e+64>>>9<<4)+14]=h.floor(b/4294967296);d[(e+64>>>9<<4)+15]=b;a.sigBytes=4*d.length;this._process();return this._hash},clone:function(){var a=q.clone.call(this);a._hash=this._hash.clone();return a}});s.SHA256=q._createHelper(f);s.HmacSHA256=q._createHmacHelper(f)})(Math);
(function(){var h=CryptoJS,s=h.enc.Utf8;h.algo.HMAC=h.lib.Base.extend({init:function(f,g){f=this._hasher=new f.init;"string"==typeof g&&(g=s.parse(g));var h=f.blockSize,m=4*h;g.sigBytes>m&&(g=f.finalize(g));g.clamp();for(var r=this._oKey=g.clone(),l=this._iKey=g.clone(),k=r.words,n=l.words,j=0;j<h;j++)k[j]^=1549556828,n[j]^=909522486;r.sigBytes=l.sigBytes=m;this.reset()},reset:function(){var f=this._hasher;f.reset();f.update(this._iKey)},update:function(f){this._hasher.update(f);return this},finalize:function(f){var g=
this._hasher;f=g.finalize(f);g.reset();return g.finalize(this._oKey.clone().concat(f))}})})();// 接口暴露出去 完活。。module.exports = {request,get,post,URL,
}

以上是在request.js文件封装的代码

下面是在api文件里封装的接口url拼接的后面部分

// 引入请求方式
import {request,get,post,upLoad
} from './request';// 例如书画列表接口  post请求方式 params代表参数，xxx是写自己的接口 完工  这个一个接口 五个接口就复制5个
function paintinglist(params) {return post('/xxx/xxx', params)
}// 把这个请求暴露出去
export default {paintinglist
}

以上就是全部的微信小程序封装的步骤，即可请求成功帮到大家请点个赞谢谢哦 wx：gx97280 互相交流

微信小程序封装api请求步骤相关推荐

微信小程序封装request请求数据
遇到问题不要慌做项目离不开请求数据 1.为什么要封装api去请求接口数据做微信小程序的时候请求数据的时候会多次用到wx.request请求,如果每次都去写一遍 wx.request({url: ' ...
微信小程序request请求封装；微信小程序封装request请求；uni-app小程序封装request请求；
本片封装了微信小程序request请求:为别是post get put请求,重点在request.js文件 1.新增四个文件 2.根目录下的utils下的request.js封装uni.request ...
微信小程序封装网络请求并调用
微信小程序开发交流qq群 526474645 正文: util.js // 网络请求 const request = function(url, method, data, msg, succ, ...
微信小程序-封装http请求（ajax）
官方api发起请求: wx.request 进行封装:要进行一些公共处理,比如添加处理拦截等等在app.js中声明url前缀 url: '请求ip地址', 声明ajax方法 ajax(model) ...
微信小程序封装request请求，primise队列化，async await做同步处理，缓存token信息
话不多数直接上代码! 在app.js文件中加入,一般新建的项目都有globalData只需要在里面添加你的信息就行了 globalData: {Ip:'',Header:{ //request 请求头 ...
小程序ajax返回html,微信小程序封装Ajax请求
var a朋不功事做时次功好来多这开制的请一例农在pp = getApp()是能览调不页新代些事几求事都时学下是事; c带道术用量确示常构端析以要效开的用,近不onst serverIp = app. ...
微信小程序封装multipart请求体（wx-formdata）
封装 mimeMap.js module.exports = {"0.001": "application/x-001","0.323": ...
微信小程序封装post请求 header加token code码拦截
1.添加一个js文件例如:class/api/Post.js 2.编写js文件例:token我存在用户信息 17000用户信息过期 3.引用 app.js 4.页面使用代码: export ...
微信小程序安装与开发步骤
微信小程序安装与开发步骤 1.登陆 :微信专有开发工具安装地址如图:我选择的是稳定版,64位安装完成后如图: 图 2 . 2.新建第一个小程序 2.1 申请 AppID 登陆https://mp ...

微信小程序封装api请求步骤

微信小程序封装api请求步骤相关推荐

最新文章

热门文章