更新记录

1.0.0（2025-08-26）下载此版本

1、api请求方法已经在 Api.js 和 Http.js文件中完善，打开文件自行修改为自己的真实请求地址即可 2、生产、测试环境配置文件需在 config.js 中自行配置为自己的真实地址即可 3、全局引用已经在 main.js中给出配置，无须修改

平台兼容性

uni-app(4.25)

Vue2	Vue3	Chrome	Safari	app-vue	app-nvue	Android	iOS	鸿蒙
√	-	√	√	√	√	√	√	√

微信小程序	支付宝小程序	抖音小程序	百度小程序	快手小程序	京东小程序	鸿蒙元服务	QQ小程序	飞书小程序	快应用-华为	快应用-联盟
√	√	√	√	√	√	√	√	√	√	√

uni-app x(4.25)

Chrome	Safari	Android	iOS	鸿蒙	微信小程序
√	√	√	√	√	√

一、目录介绍

二、描述

api请求方法已经在 Api.js 和 Http.js 文件中完善，打开文件自行修改为自己的真实请求地址即可
生产、测试环境配置文件需在 Config/index.js文件中配置即可

2.1、main.js文件配置（全局注册）


import App from './App'

// #ifndef VUE3
import Vue from 'vue'

/*================== 全局注册 ==================*/

// API
import Api from './uni_modules/duck-http-request/js_sdk/Https/Api.js'
Vue.prototype.$api = Api // 挂载 api 实例到 Vue 原型上

// 获取设备系统信息，包括窗口大小、状态栏、底部安全区等
import SystemUtils from './uni_modules/duck-http-request/js_sdk/System/index.js'
Vue.prototype.$system = SystemUtils // 直接挂载 实例到 Vue 原型上

// 提示插件类
import toast from './uni_modules/duck-http-request/js_sdk/Public/ToastPlugin.js' 
Vue.use(toast) // 插件方式(推荐)

/*================== End 全局注册  ==================*/

import './uni.promisify.adaptor'
Vue.config.productionTip = false
App.mpType = 'app'
const app = new Vue({
  ...App
})
app.$mount()
// #endif

// #ifdef VUE3
import { createSSRApp } from 'vue'
export function createApp() {
  const app = createSSRApp(App)
  return {
    app
  }
}
// #endif

2.2、index.vue文件中引用示例

<template>
    <view>
        <!-- 组件内容 -->
    </view>
</template>

<script>
    export default {
        data() {
            return {
                // 数据属性
            };
        },
        onShow() {
            // this.Init() // 接口
            this.$toast.default('ddd') // 弹窗
            console.log( this.$system.getAllInfo() ) // 获取系统信息
        },
        methods: {
            /*================== 调用Api ==================*/

            async init(){
                try{
                    const res = await this.$api.login()
                    if(res.code !== 200) return 
                    if(res.code === 200){
                        const {data} = res.result
                        // 根据你的要求可进行扩展
                    }
                }catch(err){
                    throw Error(err.msg)
                }
            },

            /*================== End 调用Api ==================*/
        }
    };
</script>

<style lang="scss" scoped>

/* 你的样式 */

</style>

三、Vuex Store

3.1、store/modules/Account.js

/**
 * 当前用户信息
 */

export default {
    namespaced: true, // 启用命名空间，使该模块成为独立的命名空间模块

    state: {
        userInfo: null // 用户信息状态，初始值为null表示未登录
    },

    mutations: {
        /**
         * 设置用户信息
         */
        SET_TOKEN(state, userInfo) {
            state.userInfo = userInfo // 将传入的用户信息保存到state中
            // 根据环境变量设置不同的存储key，实现开发和生产环境数据隔离
            const storageKey = process.env.NODE_ENV === 'development' ?
                'aab_dev_token' : // 开发环境使用aab_dev_token作为存储key
                'aab_prod_token' // 生产环境使用aab_prod_token作为存储key

            uni.setStorageSync(storageKey, userInfo) // 将用户信息同步存储到本地缓存中
        },

        /**
         * 退出登录 清除userInfo
         */
        LOG_OUT(state) {
            state.userInfo = null // 将用户信息状态重置为null
            // 清除两个环境可能存在的token，确保数据彻底清除
            uni.removeStorageSync('aab_dev_token') // 清除开发环境的用户数据
            uni.removeStorageSync('aab_prod_token') // 清除生产环境的用户数据

            // 清除所有本地存储的数据，确保用户退出时清理所有缓存
            try {
                // 获取所有存储的key信息
                const res = uni.getStorageInfoSync()
                const keys = res.keys // 获取所有存储key的数组

                // 遍历并删除所有本地存储的key
                keys.forEach(key => {
                    uni.removeStorageSync(key) // 逐个删除存储的数据
                })
            } catch (error) {
                console.warn('清除所有缓存时出错:', error) // 捕获并记录清理过程中的错误
            }

        }
    },
    actions: {
        /**
         * 初始化用户信息
         */
        initUserInfo({
            commit
        }) {
            // 获取当前环境的存储 key，与SET_TOKEN保持一致的环境判断逻辑
            const storageKey = process.env.NODE_ENV === 'development' ?
                'aab_dev_token' : // 开发环境使用aab_dev_token作为存储key
                'aab_prod_token'; // 生产环境使用aab_prod_token作为存储key

            const userInfo = uni.getStorageSync(storageKey); // 从本地存储中同步获取用户信息
            if (userInfo) { // 如果存在用户信息（用户已登录）
                commit('SET_TOKEN', userInfo); // 提交SET_TOKEN mutation，初始化用户状态
            }
        },

        /**
         * 登录时设置userInfo
         */
        login({commit}, {userInfo}) {
            commit('SET_TOKEN', userInfo) // 提交SET_TOKEN mutation，保存用户信息
        },

        /**
         * 退出登录
         */
        logout({commit}) {
            commit('LOG_OUT') // 提交LOG_OUT mutation，执行退出登录操作
        }

    },
    getters: {
        /**
         * 获取 token
         * @param {Object} state
         */
        getToken(state) {
            return state.userInfo?.token || null // 安全地返回用户token，如果userInfo或token不存在则返回null
        },

        /**
         * 
         * 获取用户信息
         * @param {Object} state
         */
        getUserInfo(state) {
            return state.userInfo // 返回完整的用户信息对象
        }
    }
}

3.2、store/index.js

/**
 * Vuex index
 */

import Vue from 'vue';
import Vuex from 'vuex';

import useAccount from './modules/Account'; // 用户信息

Vue.use(Vuex);

// 获取环境特定的存储 key
function getStorageKey() {
    if (process.env.NODE_ENV === 'development') {
        return 'erp_dev_token';
    }
    return 'erp_prod_token';
}

const store = new Vuex.Store({
    modules: {
        useAccount
    }
})

// 获取当前环境的存储 key
const storageKey = getStorageKey();

// 初始化时恢复 token
const cachedUserInfo = uni.getStorageSync(storageKey);
if (cachedUserInfo) {
    store.commit('useAccount/SET_TOKEN', cachedUserInfo);

    // 开发环境添加日志便于调试
    if (process.env.NODE_ENV === 'development') {
        console.log(`[${process.env.NODE_ENV}] 从 ${storageKey} 恢复用户信息`, cachedUserInfo);
    }
} else {
    // 开发环境添加日志便于调试
    if (process.env.NODE_ENV === 'development') {
        console.log(`[${process.env.NODE_ENV}] ${storageKey} 无缓存用户信息`);
    }
}

export default store

四、引入 store

4.1、App.vue

<script>

    import store from './store';

    export default {
        store, // 注入 Vuex Store，使得所有子组件都能访问 this.$store

        onLaunch: function() {
            // 初始化用户 Vuex
            store.dispatch('useAccount/initUserInfo')
            console.log('App Launch')
        },

        onShow: function() {
            console.log('App Show')
        },
        onHide: function() {
            console.log('App Hide')
        }
    }
</script>

<style>
    /*每个页面公共css */
</style>

Http Restful Api http api restful

更新记录

1.0.0（2025-08-26）下载此版本

平台兼容性

uni-app(4.25)

uni-app x(4.25)

一、目录介绍

二、描述

2.1、main.js文件配置（全局注册）

2.2、index.vue文件中引用示例

三、Vuex Store

3.1、store/modules/Account.js

3.2、store/index.js

四、引入 store

4.1、App.vue

隐私、权限声明

1. 本插件需要申请的系统权限列表：

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明：

3. 本插件是否包含广告，如包含需详细说明广告表达方式、展示频率：

许可协议

MIT协议

新零售020移动端

简单好用的验证码倒计时

简单好用的axios-request集合请求

商品sku

餐饮奶茶咖啡蛋糕店外卖小程序

Http Restful Api http api restful

更新记录

1.0.0（2025-08-26） 下载此版本

平台兼容性

uni-app(4.25)

uni-app x(4.25)

一、目录介绍

二、描述

2.1、main.js文件配置（全局注册）

2.2、index.vue文件中引用示例

三、Vuex Store

3.1、store/modules/Account.js

3.2、store/index.js

四、引入 store

4.1、App.vue

隐私、权限声明

1. 本插件需要申请的系统权限列表：

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明：

3. 本插件是否包含广告，如包含需详细说明广告表达方式、展示频率：

许可协议

MIT协议

新零售020移动端

简单好用的验证码倒计时

简单好用的axios-request集合请求

商品sku

餐饮奶茶咖啡蛋糕店外卖小程序

Modal title

1.0.0（2025-08-26）下载此版本