sd.js?

import $global from "./global";
import $g from "./sg";
import $ from "jquery";
import {Message, Loading} from "element-ui";//引入餓了么相關組件
import {Base64} from "js-base64"; //cnpm i --save js-base64 & cnpm i --save
//import axios from 'axios';const isLocal = location.href.includes("localhost") || location.href.includes("127.0.0.1") || location.href.includes("192.168"); //是否本地運行
//常用路徑----------------------------------------------------------------
// const API_ROOT_URL = "//xxx.xxx.com/api"; //發布到服務器用這個，遠程測試服務器
const API_ROOT_URL = "/api"; //本地代理測試服務器if (isLocal) {var isLocalAPI = API_ROOT_URL.includes("localhost") || API_ROOT_URL.includes("127.0.0.1") || API_ROOT_URL.includes("192.168");Message.error(`測試環境：${isLocalAPI ? "本地" : "遠程服務器"}API`);
}// 常量----------------------------------------
const website = {clientId: "xxx",clientSecret: "xxx"
};
//主體請求----------------------------------------------------------------
export default {//API URL????????????????????????????????// 公共方法________________________________________________//API FUNCTION ????????????????????????????????load: {},// 顯示加載動畫loading(text = "加載中…", name) {this.load && (this.load[name] = Loading.service({text}));},// 顯示加載動畫hideLoading(name) {this.load && this.load[name] && this.load[name].close();},// 錯誤提示errorTip(where, d, url) {Message.error("【可能是" +where + "報錯】\n\r" +"接口地址：" + url + "\n\r" +"返回報文：" + JSON.stringify(d, null, 4));},// 跳轉到登錄頁面jumpLoginPage(todo = false) {if (!location.hash.includes("/login")) {if (todo) {Message.success("已退出");} else {var token = $g.cookie.get("token"); //獲取tokenMessage.error(token ? "登錄狀態已過期，請重新登錄！" : "您還未登錄，請登錄后操作！");// alert(token ? "登錄狀態已過期，請重新登錄！" : "您還未登錄，請登錄后操作！");}$g.cookie.clearAll();var storageKey = $global.config.storageKey;localStorage.removeItem(storageKey);var url = location.href.split("#")[0] + "#/login?url=" + encodeURIComponent(location.href);location.replace(url);}},// 獲取當前用戶名/* getUserName() {var up = localStorage.getItem($global.config.storageKey); //獲取本地保存的用戶名和密碼if (up) {up = up.split($global.config.splitStr);return Base64.decode(up[0]);} else {this.jumpLoginPage();}}, *///API FUNCTION ????????????????????????????????__sd(url, data, doing = {}, otherConfig = {}, type) {//別名轉義 ----------------------------------------------------------------doing.s && (doing.success = doing.s); //精簡別名doing.f && (doing.fail = doing.f); //精簡別名doing.e && (doing.error = doing.e); //精簡別名typeof doing.l === "string" ? this.loading(doing.l, url) : (doing.l && (doing.loading = doing.l)); //精簡別名[加載]// ----------------------------------------------------------------var token = $g.cookie.get("token"); //獲取token//noAutoToken=true代表該接口無需保持登錄狀態就可以獲取信息，譬如一些公共對外開放的接口if (!otherConfig.noAutoToken) {data || (data = {});if (token) {data["Blade-Auth"] = "bearer   " + token;} else {doing.loading && doing.loading.close(); //關閉加載// 如果本地沒有tokenif (location.href.includes("/login")) {} else {//判斷如果不是在登錄頁，且本地沒有token或者token里面沒有用戶名和密碼，則直接跳轉到登錄頁面return this.jumpLoginPage();}}}// ----------------------------------------------------------------var headers = {"Content-Type": data["Content-Type"] || "application/x-www-form-urlencoded","Authorization": `Basic ${Base64.encode(`${website.clientId}:${website.clientSecret}`)}`//所有頁面都要Authorization};data["Blade-Auth"] && (headers["Blade-Auth"] = data["Blade-Auth"]);if (data) {var contentType = data["Content-Type"];delete data["Content-Type"];delete data["Authorization"];delete data["Blade-Auth"];if (location.href.includes("/login")) {$g.cookie.clearAll();}if (contentType === "application/json") {data = JSON.stringify(data);}}doing.loading && doing.loading.show && doing.loading.show(); //顯示加載動畫$.ajax({timeout: 10 * 60 * 1000, //設置默認超時時間10分鐘type: type || "POST",url,data,headers,success: d => {doing.loading && doing.loading.close(); //關閉加載this.hideLoading(url); //關閉加載switch (d.code) {case 200: //登錄成功 ? ? ? ? ? ? ? ?d.data && d.data.accessToken && (token = d.data.accessToken); //更新token$g.cookie.setByMinute("token", token, 60); //存儲到本地60分鐘的保存時間doing.success && doing.success(otherConfig.isGetAllData ? d : (d.data || d));break;case 401: //token失效 ? ? ? ?this.jumpLoginPage();doing.fail && doing.fail(d);break;case -1: //請求失敗 ? ? ? ?default: //請求失敗 ? ? ? ?doing.fail ? doing.fail(d) : Message.error(d.msg);console.log("【報錯】" + JSON.stringify(d, null, 4));break;}},error: d => { //請求報錯 ? ? ? ?doing.loading && doing.loading.close(); //關閉加載this.hideLoading(url); //關閉加載doing.error ? doing.error(d) : this.errorTip("后端邏輯", d, url);console.log("【報錯】" + JSON.stringify(d, null, 4));}});},//????????????????????????????????//登錄接口login(data, doing) {this.__sd(API_ROOT_URL + "/login/token", data, doing, {noAutoToken: true});},// 例子************************************************demo(data = {}, doing) {data["Content-Type"] = "application/json";this.__sd(API_ROOT_URL + "/api-data/query ", data, doing, {}, "post");}, // ----------------------------------------
};

使用demo?

//精簡模式----------------------------------------
var d = { id: 1 };this.$d.API(d, {//l: { show: () => (this.loading = true), close: () => (this.loading = false), },s: (d) => {console.log("【成功】", d);} 
});//一般模式----------------------------------------
var d = { param: "參數值", pageNum: 0 };this.$d.API_NAME(d, {l: "加載中…",//l: { show: () => (this.loading = true), close: () => (this.loading = false),  },s: (d) => {console.log("【成功】", d);} //,f:d=> this.$message.error(d.msg),});

總結

以上是生活随笔為你收集整理的sd.js 2.0封装：更加简化请求传参内容的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。