hookehuyr

feat(api): 为图片流接口添加忽略全局loading的配置

为getImgStreamAPI添加ignore_loading选项,避免加载图片流时显示全局loading
修改axios拦截器逻辑以支持配置忽略loading
移除未使用的showSuccessToast导入并优化fetch方法注释
/*
* @Date: 2022-05-18 22:56:08
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2023-08-24 10:56:44
* @FilePath: /front/src/api/fn.js
* @LastEditTime: 2025-11-04 21:18:39
* @FilePath: /stdj_h5/src/api/fn.js
* @Description: 文件描述
*/
import axios from '@/utils/axios';
import { showSuccessToast, showFailToast } from 'vant';
import { showFailToast } from 'vant';
import qs from 'Qs'
/**
......@@ -65,16 +65,44 @@ export const uploadFn = (api) => {
* 统一 GET/POST 不同传参形式
*/
export const fetch = {
get: function (api, params) {
return axios.get(api, { params })
},
post: function (api, params) {
return axios.post(api, params)
},
stringifyPost: function (api, params) {
return axios.post(api, qs.stringify(params))
},
basePost: function (url, data, config) {
return axios.post(url, data, config)
}
/**
* GET 请求封装
* @param {string} api 接口地址
* @param {object} params 查询参数
* @param {object} config 额外axios配置(可选),如 { ignore_loading: true }
* @returns {Promise} axios响应
*/
get: function (api, params, config) {
return axios.get(api, { params, ...(config || {}) })
},
/**
* POST 请求封装
* @param {string} api 接口地址
* @param {object} params 请求体数据
* @param {object} config 额外axios配置(可选)
* @returns {Promise} axios响应
*/
post: function (api, params, config) {
return axios.post(api, params, config)
},
/**
* POST(表单序列化)
* @param {string} api 接口地址
* @param {object} params 请求体数据(将被序列化)
* @param {object} config 额外axios配置(可选)
* @returns {Promise} axios响应
*/
stringifyPost: function (api, params, config) {
return axios.post(api, qs.stringify(params), config)
},
/**
* 基础POST
* @param {string} url 完整地址
* @param {object} data 请求体数据
* @param {object} config axios配置
* @returns {Promise} axios响应
*/
basePost: function (url, data, config) {
return axios.post(url, data, config)
}
}
......
/*
* @Date: 2023-08-24 09:42:27
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2025-11-03 15:21:35
* @LastEditTime: 2025-11-04 21:18:22
* @FilePath: /stdj_h5/src/api/index.js
* @Description: 文件描述
*/
......@@ -63,7 +63,11 @@ export const getSSQZAPI = (params) => fn(fetch.get(Api.GET_ARTICLE, params));
* @property [object] data.list 封面图列表
* @property string data.list.value 封面图地址
*/
export const getImgStreamAPI = (params) => fn(fetch.get(Api.GET_ARTICLE_FILE, params));
/**
* 忽略全局Loading的图片流媒体接口
* @description 调用该接口时不显示全局loading蒙版
*/
export const getImgStreamAPI = (params) => fn(fetch.get(Api.GET_ARTICLE_FILE, params, { ignore_loading: true }));
/**
* @description: 文章详情数据
......
......@@ -33,8 +33,9 @@ function safe_loading(method) {
loading.reset()
}
} catch (e) {
// 兜底:Pinia未就绪或Store未初始化时跳过,并输出调试信息
console.debug('全局loading未初始化,已跳过:', e)
// 兜底:Pinia未就绪或Store未初始化时跳过
// 使用空操作避免空块,同时不打印控制台信息
void e
}
}
......@@ -43,8 +44,10 @@ function safe_loading(method) {
*/
axios.interceptors.request.use(
config => {
// 开始全局loading计数(安全封装)
safe_loading('start')
// 开始全局loading计数(安全封装),可通过config.ignore_loading禁用
if (!config || config.ignore_loading !== true) {
safe_loading('start')
}
// const url_params = parseQueryString(location.href);
// GET请求默认打上时间戳,避免从缓存中拿数据。
const timestamp = config.method === 'get' ? (new Date()).valueOf() : '';
......@@ -60,7 +63,9 @@ axios.interceptors.request.use(
error => {
// 请求错误处理
// 出现错误时重置loading,避免长时间遮挡(安全封装)
safe_loading('reset')
if (!error || !error.config || error.config.ignore_loading !== true) {
safe_loading('reset')
}
return Promise.reject(error);
});
......@@ -71,13 +76,17 @@ axios.interceptors.response.use(
response => {
// 响应完成后减少计数
// 正常响应结束时减少pending计数,归零后关闭蒙版(安全封装)
safe_loading('end')
if (!response || !response.config || response.config.ignore_loading !== true) {
safe_loading('end')
}
return response;
},
error => {
// 响应异常时直接重置隐藏loading
// 任一接口失败则关闭全局loading,交由页面/业务自行反馈错误(安全封装)
safe_loading('reset')
if (!error || !error.config || error.config.ignore_loading !== true) {
safe_loading('reset')
}
return Promise.reject(error);
});
......