一个完整的前端项目往往会进行一些必要的抽取公用代码进行封装，这里记录js常用工具及统一的公共请求的封装。

一  2017年 第一版web管理后台在用

   web后台管理页面用

/*** Created by hua on 2017/8/24.*/
var requestResult={success :0,failure:1,failureMsg:2
}jx={reqAjax:function (isSync,url,fnSuccess,fnFailure) {$.ajax({type: "post",dataType:"json",async: isSync||true,url: url,success: function (data) {console.log(data);if (data.code ==requestResult.success ){if ( jQuery.isFunction( fnSuccess ) ) {fnSuccess.call();}else{alert("操作成功。");}}else{if (data.code ==requestResult.failure){alert("操作失败！");}if (data.code ==requestResult.failureMsg){if (data.errMsg!=''){alert(data.errMsg);}else{alert("操作失败，返回信息异常！")}}if ( jQuery.isFunction( fnFailure ) ) {fnFailure.call();}}},error:function(err){alert("系统请求错误，请联系管理员！");}});},req:function (url,fnSuccess) {jx.reqAjax(false,url, fnSuccess,null);},createNativeRequest: function createRequest(){var xmlHttp;try{// Firefox, Opera 8.0+, SafarixmlHttp=new XMLHttpRequest();}catch (e){// Internet Explorertry{xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");}catch (e){try{xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");}catch (e){alert("您的浏览器不支持登陆！");return false;}}}return xmlHttp;},nativeReq:function (async,url,param,fuSccess,fuFail) {console.log('using native ajax.');var xmlhttp= jx.createNativeRequest();console.log('create native xmlhttp');console.log(xmlhttp);xmlhttp.open("POST",url,async||false);// 为空时同步xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");if (!async){xmlhttp.send(param);var result= xmlhttp.responseText;console.log(result);return result;}else{xmlhttp.onreadystatechange=function state_Change() {if (xmlhttp.readyState==4){// 4 = "loaded"if (xmlhttp.status==200) {if (fuSccess && typeof(fuSccess) == "function") {fuSccess();}}else{if (fuFail && typeof(fuFail) == "function") {fuFail();}}}};xmlhttp.send(param);}}};jxCookie={setCookie:function (name,value){   var Days = 7;var exp = new Date();exp.setTime(exp.getTime() + Days*24*60*60*1000);document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();},getCookie:function (name){var arr,reg=new RegExp("(^| )"+name+"=([^;]*)(;|$)");if(arr=document.cookie.match(reg))return unescape(arr[2]);elsereturn null;},delCookie:function (name){var exp = new Date();exp.setTime(exp.getTime() - 1);var cval=getCookie(name);if(cval!=null)document.cookie= name + "="+cval+";expires="+exp.toGMTString();}
}/**按钮等待进度   使用方法： jxProcess.run(butid, txtid, 1,30,'已发送成功(_sec_)')    说明：butid 和 txtid 为Input元素对象ID，1 代表每隔几秒刷新次数， 30代表等待30秒，最后的参数为等时间显示到按钮的字体动态显示参数 _sec_      **/
var jxProcess={cur:60,jqElemBut:undefined,jqElemTxt:undefined,normalButLabel:undefined,dyTimeLabel:undefined,t:undefined,startWait:function () {if (jxProcess.cur > 0){var label= jxProcess.dyTimeLabel.replace("_sec_",jxProcess.cur);jxProcess.cur--;jxProcess.jqElemBut.html(label);}else{jxProcess.runStop();}},getJqueryObjById:function(id){var _id="#"+id;return $(_id);},run:function (butId,txtId,timeSec,sumSec,dyTimeLabel) {var  $elemBut= jxProcess.getJqueryObjById(butId);var  $elemTxt=jxProcess.getJqueryObjById(txtId);$elemBut.attr("disabled",true);$elemTxt.attr("readonly",true);jxProcess.cur = sumSec||60;jxProcess.jqElemBut=$elemBut;jxProcess.jqElemTxt=$elemTxt;jxProcess.normalButLabel=$elemBut.html();jxProcess.dyTimeLabel=dyTimeLabel||'请耐心等待_sec_秒.'jxProcess.t  = window.setInterval('jxProcess.startWait()',timeSec*1000||1000);},runStop:function () {if (jxProcess.t!=undefined){jxProcess.jqElemBut.attr("disabled",false);if (jxProcess.jqElemTxt){jxProcess.jqElemTxt.attr("readonly",false);}jxProcess.jqElemBut.html(jxProcess.normalButLabel);window.clearInterval(jxProcess.t);console.log("clearInterval");jxProcess.t=undefined;}}}

二  2018年，在微信小程序在使用，项目要求加密请求要用rc4算法加密。

//引用配置文件
const cfg = require('../config.js');//打印调试信息
function tag(obj,msg) {console.log(new Date());console.log("==========begin("+msg+")===========")try {console.log(obj);} catch (e) {console.log('print err !!!');}console.log("==========end("+msg+")===========")
}//封包
function getPackage(data){var data_str='';if(data){data_str=JSON.stringify(data);}var pack={appKey:'123456',version:'1.0.0',isEncrypt:'N',data:data_str}return pack;
}//取得用户openid
function getOpenid(){var openid = getCache("openid");if (openid) {return openid;}wx.login({//获取codesuccess: function (res) {var code = res.code //返回codevar url = cfg.config.getOpenIdUrl+'&js_code=' + code + '&grant_type=authorization_code';tag(url,"get openid url");wx.request({url: url,data: {},header: {'content-type': 'application/json'},success: function (res) {if (res.data.openid){setCache("openid", res.data.openid);}}})}});return openid;}function setCache(key, value) {if (key != null && value != null) {try {wx.setStorageSync(key, value);tag(value, "保存缓存成功 key=" + key);return true;} catch (e) {tag(e, "保存到缓存失败 key=" + key + " value=" + value);}}return false;
}function getCache(key) {var obj = null;if (key) {try {obj = wx.getStorageSync(key);tag(obj, "从缓存取 key=" + key);} catch (e) {tag(e, "从缓存取数据失败 key=" + key);}}return obj;
}function isMobile(mobile) {var myreg = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1})|(17[0-9]{1}))+\d{8})$/;return myreg.test(mobile);}//显示成功信息
function show(title,icon){wx.showToast({title: title||'JX信息提示',icon:icon||'success',duration: 1500});
}//显示错误信息
function showErr(title){show(title,'loading');
}function getLoginToken(){return getCache('loginToken');
}function setLoginToken(loginToken) {return setCache('loginToken', loginToken);
}//原始处理，不对外开发
function reqPackOrg(reqUrl, pack, fnSuccess, fnFail) {wx.request({method: 'POST',url: reqUrl,data: pack,header: {'content-type': 'application/x-www-form-urlencoded','Cookie': 'loginToken='+getLoginToken()},success: function (result) {tag(result, "结果处理");if (fnSuccess) {fnSuccess.call(result);} else {show("操作成功");}},fail: function (result) {tag(res, "调用API submit fail");if (fnFail) {fnFail.call(result);} else {showErr("操作失败！");}},complete: function (result) {tag(result, "调用API结果submit complete");}});}//结合后台业务处理，统一调用
function reqPack(reqUrl, pack, fnSuccess, fnFail, fnComplete){wx.request({method: 'POST',url: reqUrl,data: pack,header: {'content-type': 'application/x-www-form-urlencoded'},success: function (result) {var pack= result.data;tag(pack, "结果处理");if (pack.resultCode==200){var busData = pack.data;if (typeof busData== 'string') {busData = busData.replace(/\ufeff/g, "");//重点var jsonObj = JSON.parse(busData);pack.data = jsonObj;}if (fnSuccess) {if (fnSuccess.length == 1){fnSuccess.call(this, pack);}else{fnSuccess.call();}} else {show("操作成功");}}else{if (fnFail) {fnFail.call(result);}else{if (pack.resultCode && pack.resultMsg) {showErr( pack.resultMsg + "[" + pack.resultCode + "]");} else {showErr("处理错误！");}}} },fail: function (result) {tag(res, "调用API submit fail");if (fnFail) {fnFail.call(result);}else{showErr("操作失败！");}},complete: function (result) {tag(result, "调用API结果submit complete");if (fnComplete){fnComplete.call();}}});}function reqData(api, jsonData, fnSuccess, fnFail,fnComplete) {var reqUrl=cfg.config.jx_url+api;var pack = getPackage(jsonData);reqPack(reqUrl, pack, fnSuccess, fnFail, fnComplete);}function req(api, fnSuccess, fnFail) {var reqUrl = cfg.config.jx_url + api;var pack = getPackage(null);reqPack(reqUrl, pack, fnSuccess, fnFail,null)}let curUserInfo = 'curUserInfo';function setUserInfoCache(userInfo) {var memberInfo = {nickName: userInfo.nickName,org: userInfo};setCache(curUserInfo, memberInfo)}function getUserInfo(){return getCache(curUserInfo);}//每个业务页面初始化处理function init(){var token=getLoginToken();tag(token,"检测在线标识状态");if(!token){wx.redirectTo({url: cfg.config.loginUrl});}}module.exports = {getPackage: getPackage,tag: tag,getOpenid: getOpenid, isMobile: isMobile,reqData: reqData,req:req, setUserInfoCache: setUserInfoCache,show: show, showErr: showErr,getLoginToken: getLoginToken,setLoginToken: setLoginToken,getUserInfo: getUserInfo,init: init}

三  2019年后，公司开始接很多的项目，小程序项目基本都用uni-app框架开发，再优化一点，根据使用情况对function request(method, reqUrl, pack, fnSuccess)去掉了失败函数传参。

"use strict";
//TestServer
//var baseUrl = 'http://192.168.22.193:8092'//外网地址
var baseUrl = 'http://47.xx.xx.57:8063'//线上
// var baseUrl = 'https://xcx.xxx.xxx'//封包
function getPackage(data) {let data_str = '';if (data) {data_str = JSON.stringify(data);}let pack = {language:1,isEncrypt: 'N',data: data_str}return pack;
}function request(method, reqUrl, pack, fnSuccess) {pack = getPackage(pack);uni.request({method: method || 'POST',url: baseUrl + reqUrl,data: pack,header: {'Content-Type': 'application/x-www-form-urlencoded','Authorization': getCache("token")? getCache("token") : ""},success: function(result) {let pack = result;if (fnSuccess) {if (fnSuccess.length == 1) {fnSuccess.call(this, pack);} else if (fnSuccess.length == 2) {fnSuccess.call(this, pack, pack.data.data);} else {fnSuccess.call();}} else {showToast("操作成功");}},fail: function(result) {try {if (result.errMsg.indexOf('request:fail') != -1) {alert("似乎已断开与互联网的连接");} else {alert("操作失败！");}} catch (e) {alert("操作失败！");}}})
}function navigateTo(url) {uni.navigateTo({url: url});
}function switchTab(url) {uni.switchTab({url: url});
}function redirectTo(url) {uni.redirectTo({url: url});
}function showToast(title, icon) {uni.showToast({title: title || '出错了',icon: icon || 'success',duration: 2000});
}
// alert
function alert(msg, title, success) {uni.showModal({title: '温馨提示' || title,content: msg,showCancel: false,confirmColor: "#000",success: success || {}})
}
//设置缓存
function setCache(key, value) {if (key != null && value != null) {try {uni.setStorageSync(key, value);// console.log('设置缓存' + key + '=' + value);} catch (e) {console.log(e, "保存缓存失败")}}
}
//取出缓存
function getCache(key) {var obj = null;if (key) {try {obj = uni.getStorageSync(key);// console.log("取出缓存", obj)} catch (e) {console.log(e, "取出缓存失败")}}return obj;
}
//分享页面
function onShareAppMessage(title,url) {return {title: title || '',path: 'pages/home/home'||url}
}
// 手机验证
function isMobile(mobile) {// 最新正则var myreg = /^(13[0-9]|14[579]|15[0-3,5-9]|16[6]|17[0135678]|18[0-9]|19[89])\d{8}$/;return myreg.test(mobile);
}
// 身份证验证
function isId(isId) {var myreg = /\d{17}[\d|x]|\d{15}/;return myreg.test(isId);
}
// 邮箱验证
function iseMail(iseMail) {var myreg = /\w[-\w.+]*@([A-Za-z0-9][-A-Za-z0-9]+\.)+[A-Za-z]{2,14}/;return myreg.test(iseMail);
}
// QQ验证
function isQQ(isQQ) {var myreg = /^[1-9]\d{4,9}$/;return myreg.test(isQQ);
}//补全时间两位数
function prefixZero(n, m) {var _a = (Array(m).join(0) + n).slice(-m)return _a}
module.exports = {request: request,navigateTo: navigateTo,switchTab: switchTab,redirectTo:redirectTo,showToast: showToast,alert:	alert,setCache: setCache,getCache: getCache,onShareAppMessage:onShareAppMessage,baseUrl:baseUrl,isMobile:isMobile,isId:isId,iseMail:iseMail,isQQ:isQQ,prefixZero:prefixZero
}

这几年间公司加入专开发小程序的同事，这里太忙了我也没有时间怎么去关注了，后面发现他们具然所有的小程序项目都在用，而且连引用的文件名都没有改，如图：

四  2023年后小程序项目基本开始外包，查看了被外包修改后的代码，发现还是变化不大。

"use strict";//TestServer
//var baseUrl = 'http://192.168.22.193:8888'
//外网地址
var baseUrl = 'https://xx.xx.xx.xx'//线上// var baseUrl = 'https://xx.xx.xx'
//封包
function getPackage(data) {let data_str = '';if (data) {data_str = JSON.stringify(data);}let pack = {language:1,isEncrypt: 'N',data: data_str}return pack;
}
//8d2df462-b665-4441-8ed5-f216c8babf53
function addImgFun(tempFilePaths,fun){for(var i=0;i<tempFilePaths.length;i++){uni.uploadFile({url:baseUrl+'/api/v1/file/uploadImgs', //仅为示例，非真实的接口地址filePath: tempFilePaths[i],header:{'Authorization': getCache("token")? getCache("token") : ""},name: 'files',success: (uploadFileRes) => {console.log(JSON.parse(uploadFileRes.data).data[0]);fun(JSON.parse(uploadFileRes.data).data[0])}});}
}//xx测试账号
setCache("token",'9d307453-f0b1-4f7f-9a8c-41c1f803de73');// setCache("token",'cccf7a52-855b-42d8-b5cf-d48eb7f678c2');
// setCache("token",'74bc8184-ac49-424f-9029-273cfcbfdd62');// setCache("token",'fdd31cad-e9ce-4ad0-afc8-8c3ad42e0dc9');
function request(method, reqUrl, pack, fnSuccess,err) {// setCache("token",'8d2df462-b665-4441-8ed5-f216c8babf53');// console.log(baseUrl + reqUrl)if(!pack.noShowLoading){uni.showLoading({title: '加载中'});delete pack.noShowLoading;}pack = getPackage(pack);uni.request({method: method || 'POST',url: baseUrl + reqUrl,data: pack,header: {'Content-Type': 'application/x-www-form-urlencoded','Authorization': getCache("token")? getCache("token") : ""},success: function(result) {uni.hideLoading();let pack = result;console.log("pack+++++++++",JSON.stringify(pack))if(pack.data.code==400){showToast(pack.data.msg);if(pack.data.failReason==1||pack.data.failReason==2||pack.data.failReason==3){setCache("token","");setTimeout(function(){uni.navigateTo({url:"/pages/home/home"})},2000)}else if(pack.data.failReason==26){setTimeout(function(){uni.reLaunch({url:"../charge/charge"})},2000)}else if(pack.data.failReason==12){setTimeout(function(){uni.navigateTo({url:"../order/order"})},2000)}else if(pack.data.failReason==13){setTimeout(function(){uni.navigateBack({delta:1})},2000)}if(err){err(pack);}return false;}else if (pack.data.code&&pack.data.code==200&&fnSuccess) {if (fnSuccess.length == 1) {fnSuccess.call(this, pack);} else if (fnSuccess.length == 2) {fnSuccess.call(this, pack, pack.data.data);} else {fnSuccess.call();}}else{showToast(pack.data.msg);} // else {// 	showToast("操作成功");// }},fail: function(result) {uni.hideLoading();try {if (result.errMsg.indexOf('request:fail') != -1) {// alert("似乎已断开与互联网的连接");} else {// alert("操作失败！");}} catch (e) {// alert("操作失败！");}}})
}function navigateTo(url) {uni.navigateTo({url: url});
}function switchTab(url) {uni.switchTab({url: url});
}function redirectTo(url) {uni.redirectTo({url: url});
}function showToast(title, icon) {uni.showToast({title: title || '出错了',icon: icon || 'none',mask:true,duration: 2000});
}
// alert
function alert(msg, title, success) {uni.showModal({title: '温馨提示' || title,content: msg,showCancel: false,confirmColor: "#000",success: success || {}})
}
//设置缓存
function setCache(key, value) {if (key != null && value != null) {try {uni.setStorageSync(key, value);// console.log('设置缓存' + key + '=' + value);} catch (e) {console.log(e, "保存缓存失败")}}
}
//取出缓存
function getCache(key) {var obj = null;if (key) {try {obj = uni.getStorageSync(key);// console.log("取出缓存", obj)} catch (e) {console.log(e, "取出缓存失败")}}return obj;
}
//分享页面
function onShareAppMessage(title,url) {return {title: title || '',path: 'pages/home/home'||url}
}
// 手机验证
function isMobile(mobile) {// 最新正则var myreg = /^(13[0-9]|14[579]|15[0-3,5-9]|16[6]|17[0135678]|18[0-9]|19[89])\d{8}$/;return myreg.test(mobile);
}
// 身份证验证
function isId(isId) {var myreg = /\d{17}[\d|x]|\d{15}/;return myreg.test(isId);
}
// 邮箱验证
function iseMail(iseMail) {var myreg = /\w[-\w.+]*@([A-Za-z0-9][-A-Za-z0-9]+\.)+[A-Za-z]{2,14}/;return myreg.test(iseMail);
}
// QQ验证
function isQQ(isQQ) {var myreg = /^[1-9]\d{4,9}$/;return myreg.test(isQQ);
}//补全时间两位数
function prefixZero(n, m) {var _a = (Array(m).join(0) + n).slice(-m)return _a}//补全时间两位数
function login(fun) {if(getCache("token")){if(fun){fun();}}else{setCache("token",'')uni.login({provider: 'weixin',success: function(loginRes) {var data = {code: loginRes.code}request("POST", "/api/v1/common/wxLogin", data, (res) => {// if (res.data.ret_code == 200) {setCache("token", res.data.data.token)setCache("memberId",res.data.data.user.id)if(res.data.data.user.plateNo){setCache("memberPlateNo",res.data.data.user.plateNo);}if(fun){fun();}// } else {// 	comm.showToast(res.data.ret_msg, "none")// }})}})}
}
module.exports = {request: request,navigateTo: navigateTo,switchTab: switchTab,redirectTo:redirectTo,showToast: showToast,alert:	alert,setCache: setCache,getCache: getCache,onShareAppMessage:onShareAppMessage,baseUrl:baseUrl,isMobile:isMobile,isId:isId,iseMail:iseMail,isQQ:isQQ,prefixZero:prefixZero,addImgFun:addImgFun,login:login,
}

小程序引入调用部分

	import comm from '../../static/data/commFunc.js'//方法区let that = thisuni.showLoading({title:"加载中"})//参数var data = {current: that.current}//调用comm.request("POST","/app/v200801/member/order/list",data,(res) => {console.log("res",res)that.data = res.data.data.recordsthat.list = that.list.concat(res.data.data.records)that.total = res.data.data.totaluni.hideLoading()})