From f634a3265e87e61290a7d5b46e9532fb904e047f Mon Sep 17 00:00:00 2001
From: Tevin <tingquanren@163.com>
Date: Mon, 03 Apr 2023 14:41:10 +0800
Subject: [PATCH] 优化列表卡片组件显示与交互
---
bases/Fetcher.js | 277 +++++++++++++++++--------------------------------------
1 files changed, 85 insertions(+), 192 deletions(-)
diff --git a/bases/Fetcher.js b/bases/Fetcher.js
index 5d6c443..5a3c494 100644
--- a/bases/Fetcher.js
+++ b/bases/Fetcher.js
@@ -6,6 +6,7 @@
import Taro from '@tarojs/taro';
import Qs from 'qs';
import { Tools } from '@components/common/Tools';
+import { $hostBoot } from '@components/bases/HostBoot';
import project from '@project';
export class Fetcher {
@@ -17,17 +18,7 @@
constructor(options = {}) {
this._data = {
urlPrefix: options.urlPrefix || ['/api/common/', '/api/common/'],
- mock: Tools.getUrlParam('mock') || project.host.mock,
};
- if (this._data.mock === 'on') {
- if (project.host.assetsPath.indexOf('..') === 0) {
- this._defaultConfig.url = Fetcher.host + '/' + project.host.assetsPath.replace('/assets', '/mocks');
- } else {
- this._defaultConfig.url = Fetcher.host + project.host.assetsPath.replace('/assets', '/mocks');
- }
- } else {
- this._defaultConfig.url = Fetcher.host;
- }
}
/**
@@ -72,24 +63,13 @@
*/
spellURL(devSuffix, serSuffix) {
let url = '';
- // mock 模式
- if (this._data.mock === 'on') {
+ // mock地址
+ if ($hostBoot.isOnMock()) {
url = this._data.urlPrefix[0].replace('api/', '') + devSuffix + '.json';
}
- // 强制实际请求模式
- else if (this._data.mock === 'real') {
- url = this._data.urlPrefix[1] + (serSuffix || devSuffix);
- }
- // 正常模式
+ // 正常地址
else {
- // 开发环境地址
- if (Fetcher.inDevMod) {
- url = this._data.urlPrefix[0] + devSuffix;
- }
- // 生产环境地址
- else {
- url = this._data.urlPrefix[1] + (serSuffix || devSuffix);
- }
+ url = this._data.urlPrefix[1] + (serSuffix || devSuffix);
}
const fixReg = /[a-zA-Z0-9]+\/\.\.\//;
while (url.indexOf('../') >= 0) {
@@ -103,31 +83,30 @@
* get 请求
* @param {String} url
* @param {*} data
- * @param {(String[])[]} [remap]
* @param {object} [options]
* @return {Promise<any>}
*/
- get(url, data, remap = [], options = null) {
+ get(url, data, options = {}) {
const params = Qs.stringify(data);
if (url.indexOf('?') >= 0) {
url += '&' + params;
} else {
url += '?' + params;
}
- return this.query('get', url, null, remap, options);
+ return this.query('get', url, null, options);
}
/**
* post 请求
* @param {String} url
* @param {*} data
- * @param {(String[])[]} [remap]
* @param {object} [options]
* @return {Promise<any>}
*/
- post(url, data, remap = [], options = null) {
- if (this._data.mock === 'on') {
- return this.get(url, data, remap = [], options);
+ post(url, data, options = {}) {
+ // mock 模式转换为 get 请求
+ if ($hostBoot.isOnMock()) {
+ return this.get(url, data, options);
}
const params = Qs.stringify(data);
const data2 = {};
@@ -137,7 +116,7 @@
data2[decodeURIComponent(item[0])] = decodeURIComponent(item[1]);
}
});
- return this.query('post', url, data2, remap, options);
+ return this.query('post', url, data2, options);
}
/**
@@ -145,49 +124,83 @@
* @param {String} type
* @param {String} url
* @param {*} [data]
- * @param {*} [remap]
* @param {object} [options]
* @return {Promise<any>|}
*/
- query(type, url, data = null, remap, options = {}) {
+ query(type, url, data = null, options = {}) {
return new Promise((resolve, reject) => {
const header = {
...this._defaultConfig.header,
};
+ // 小程序中追加 cookie
if (process.env.TARO_ENV === 'weapp') {
header['Cookie'] = this._getCookies();
}
Taro.request({
...this._defaultConfig,
header,
- url: this._defaultConfig.url + url,
+ url: this._createUrlPrefix(options) + url,
method: type.toUpperCase(),
data,
success: response => {
+ // 小程序中保存 cookie
if (process.env.TARO_ENV === 'weapp') {
this._saveCookies(response.cookies);
}
+ // 捕获响应
+ options && options.onCapture && options.onCapture({
+ url: this._createUrlPrefix(options) + url,
+ request: data,
+ response: { ...response.data },
+ httpCode: response.statusCode,
+ });
/**
* @type {{state: {code, http, msg}, data: Object}}
* @example response.state.code
* 2000 通用请求成功
* 2001 请求成功，但是没有数据，弹窗提示 msg（仅特殊情况使用）
* 5000 通用请求失败，弹窗提示 msg
- * 9001 登陆已过期，弹窗提示过期且返回登陆页
- * 9002 已登陆但没有操作权限，弹窗提示 msg
+ * 9001 登录已过期，弹窗提示过期且返回登录页
+ * 9002 已登录但没有操作权限，弹窗提示 msg
*/
const responseData = this._adaptiveResponseData(response.data);
responseData.state.http = response.statusCode;
- resolve(this._transformResponseData(responseData, remap));
+ resolve(this._transformResponseData(responseData, options));
},
fail: error => {
- this._resolveCaughtNetErr(error);
+ // 处理响应
+ this._resolveCaughtNetErr(error, options, msg => {
+ // 捕获响应
+ options && options.onCapture && options.onCapture({
+ url: this._createUrlPrefix(options) + url,
+ request: data,
+ httpCode: error && error.status,
+ httpMsg: msg + (error.message ? (' / ' + error.message) : ''),
+ });
+ });
reject(null);
},
});
});
}
+ _createUrlPrefix(options) {
+ // 如果指定了主机类，使用固定主机类型地址，否则使用默认主机类型地址
+ let urlPrefix = '';
+ if (options.hostType) {
+ urlPrefix = $hostBoot.getHost(options.hostType);
+ } else {
+ urlPrefix = $hostBoot.getHost();
+ }
+ // mock 模式转换地址
+ if ($hostBoot.isOnMock()) {
+ urlPrefix += (project.host.assetsPath.indexOf('..') === 0 ? '/' : '') +
+ project.host.assetsPath.replace('/assets', '/mocks');
+ }
+ return urlPrefix;
+ }
+
+ // 小程序中，保存 cookies
_saveCookies(cookies) {
const localCookies = JSON.parse(Taro.getStorageSync('cookies') || '{}');
cookies.forEach(cookie => {
@@ -197,6 +210,7 @@
Taro.setStorageSync('cookies', JSON.stringify(localCookies));
}
+ // 小程序中，获取 cookies
_getCookies() {
const localCookies = JSON.parse(Taro.getStorageSync('cookies') || '{}');
const cookiesArr = [];
@@ -215,8 +229,8 @@
if (typeof responseData.state === 'object' && typeof responseData.data === 'object') {
return responseData;
}
- // App版请求，响应体转换
- if (typeof responseData.ret !== 'undefined' && typeof responseData.data !== 'undefined') {
+ // App版请求（存在ret直接视为App请求），响应体转换
+ if (typeof responseData.ret !== 'undefined') {
// 转换数据体
let data2 = { rows: [] };
// 数组类型
@@ -230,6 +244,10 @@
if (!Tools.isEmptyObject(responseData.data)) {
data2 = responseData.data;
}
+ }
+ // 不存在
+ else if (typeof responseData.data === 'undefined') {
+ data2 = {};
}
// 转换响应码
let code = 0;
@@ -305,9 +323,11 @@
/**
* 解析捕获的网络错误
* @param err
+ * @param options
+ * @param callback
* @private
*/
- _resolveCaughtNetErr(err) {
+ _resolveCaughtNetErr(err, options, callback) {
let msg = '';
if (err && err.status) {
switch (err.status) {
@@ -315,7 +335,7 @@
msg += '通讯请求有误！(400 Bad Request)';
break;
case 401:
- msg += '您的登陆已失效！请重新登陆！(401 Unauthorized)';
+ msg += '您的登录已失效！请重新登录！(401 Unauthorized)';
break;
case 403:
msg += '通讯请求被拒绝！(403 Forbidden)';
@@ -345,19 +365,22 @@
} else {
msg += '解析通讯数据异常！';
}
+ callback(msg);
setTimeout(() => {
- this.message('fail', msg);
+ if (typeof options.silence === 'undefined' || !options.silence) {
+ this._message('fail', msg);
+ }
}, 20);
}
/**
* 转换响应体
* @param response
- * @param {Array[]} remap
+ * @param options
* @returns {Object|{}|null}
* @private
*/
- _transformResponseData(response, remap) {
+ _transformResponseData(response, options) {
if (!response) {
return null;
}
@@ -371,91 +394,36 @@
}
// 先转驼峰
response.data = this.transKeyName('camel', response.data);
- // 再重映射
- if (remap && remap.length > 0) {
- response.data = this._remapData(response.data, remap);
- }
// 转换常规数字字符串为数值
response.data = this._transNumStringToNumber(response.data);
return response.data;
}
} else if (response.state.code === 2001) {
setTimeout(() => {
- this.message('info', response.state.msg);
+ if (typeof options.silence === 'undefined' || !options.silence) {
+ this._message('info', response.state.msg);
+ }
}, 20);
return null;
} else if (response.state.code === 9001) {
- // 在微信公众号中，每次进入即登陆，登陆失效关闭重进即可（进入链接带公司绑定码，页面没有存这个码，也不需要）
- // 在小程序中，使用自动登陆机制，自动登陆失败才去授权页绑定账号
+ // 在微信公众号中，每次进入即登录，登录失效关闭重进即可（进入链接带公司绑定码，页面没有存这个码，也不需要）
+ // 在小程序中，使用自动登录机制，自动登录失败才去授权页绑定账号
if (process.env.TARO_ENV === 'weapp') {
Taro.navigateTo({ url: '/pages/home/index/index?mode=login' });
}
- // 在App中，直接跳转登陆页
+ // 在App中，跳转到首页取消登录
if (project.appHybrid) {
- Taro.reLaunch({ url: '/pages/home/login/login' });
+ Taro.navigateTo({ url: '/pages/home/index/index?mode=logout' });
}
return null;
} else {
setTimeout(() => {
- this.message('error', response.state.msg);
+ if (typeof options.silence === 'undefined' || !options.silence) {
+ this._message('error', response.state.msg);
+ }
}, 20);
return null;
}
- }
-
- /**
- * 转换响应体数据结构
- * @param {Object} data
- * @param {Array[]} maps
- * @example maps: [
- * ['rows.[]', 'recvName', 'userName'] // 默认语法：键名转换（路径，旧名，新名）
- * ]
- * @private
- */
- _remapData(data, maps) {
- // 渡值
- const ferryValue = (source, paths, map) => {
- // 最后一环，传值
- if (paths.length === 0) {
- // 目标已有值，跳过传值不覆盖
- if (typeof source[map[2]] !== 'undefined') {
- return;
- }
- // 来源没有值，赋值空字符串
- if (typeof source[map[1]] === 'undefined') {
- source[map[2]] = '';
- }
- // 来源有值，直接赋值
- else {
- source[map[2]] = source[map[1]];
- }
- delete source[map[1]];
- return;
- }
- // 提取当前环节
- const curPath = paths.shift();
- if (curPath === '[]') {
- source.forEach(item => {
- ferryValue(item, [...paths], map);
- });
- } else {
- ferryValue(source[curPath], [...paths], map);
- }
- };
- for (let map of maps) {
- // 键名转换
- if (map[0].indexOf('.') >= 0) {
- const paths = map[0].split('.');
- ferryValue(data, paths, map);
- } else {
- if (map[0].length > 0) {
- ferryValue(data, [map[0]], map);
- } else {
- ferryValue(data, [], map);
- }
- }
- }
- return data;
}
/**
@@ -565,12 +533,12 @@
return path;
}
// 绝对路径
- if (/^(\/upload|\/static)/.test(path)) {
- return Fetcher.host + path;
+ if (/^(\/upload|\/static|\/mini|\/assets)/.test(path)) {
+ return $hostBoot.getHost() + path;
}
// 部分路径
else {
- return Fetcher.host + '/upload/' + path;
+ return $hostBoot.getHost() + '/upload/' + path;
}
}
// 裁剪多余部分
@@ -617,88 +585,13 @@
* @param type
* @param msg
*/
- message(type, msg) {
+ _message(type, msg) {
Taro.showToast({
title: msg,
icon: 'none',
- mask: true,
+ mask: false,
duration: type === 'fail' ? 3000 : 2000,
});
}
-
- /**
- * 记录是否为本地开发模式
- * @type {Boolean}
- */
- static inDevMod = (() => {
- // 网页
- if (process.env.TARO_ENV === 'h5') {
- // 当没有 url 指定时，只有内网 ip 和 33**/35** 的端口号，视为本地开发模式
- return /^(192|127|localhost).*?:3[35]\d{2}$/i.test(window.location.host);
- }
- // 小程序
- else if (process.env.TARO_ENV === 'weapp') {
- // 开发编译
- if (process.env.NODE_ENV === 'development') {
- return true;
- }
- // 生产编译
- else if (process.env.NODE_ENV === 'production') {
- return false;
- }
- }
- })();
-
- /**
- * 当前服务器主机地址
- * @type {String}
- */
- static host = (() => {
- // 网页模式
- if (process.env.TARO_ENV === 'h5') {
- // 如果网址参数有指定服务器
- const server = Tools.getUrlParam('server');
- if (server) {
- // 如果是完整网址，直接使用地址
- if (server.indexOf('http') >= 0) {
- return server;
- }
- // 如果有匹配服务器，使用指定的服务器地址
- if (typeof project.host.hosts[server] !== 'undefined') {
- return project.host.hosts[server];
- }
- // 否则使用本地
- else {
- return project.host.hosts.lc;
- }
- }
- // 网页域名提取服务器地址
- else if (window.location.protocol.indexOf('http') >= 0) {
- return window.location.protocol + '//' + window.location.host;
- }
- // 既不指定server也不是域名访问，使用设置的服务器地址
- else {
- // 开发
- if (Fetcher.inDevMod) {
- return project.host.hosts[project.host.devType];
- }
- // 生产
- else {
- return project.host.hosts[project.host.serverType];
- }
- }
- }
- // 小程序模式
- else if (process.env.TARO_ENV === 'weapp') {
- // 开发
- if (Fetcher.inDevMod) {
- return project.host.hosts[project.host.devType];
- }
- // 生产
- else {
- return project.host.hosts[project.host.serverType];
- }
- }
- })();
}
--
Gitblit v1.9.1