企业级~uni-app网络请求封装

├── api                        # 所有请求
│   └── user.js          	   # 用户请求api
├── store                      # 全局store管理
│   └── modules          	   # api模块
│   │   └── user.js            # 用户请求模块
│   └── index.js          	   # 状态管理初始化
├── utils                      # 全局公用方法
│   ├── auth.js                # 本地缓存
│   ├── env.js                 # 公共参数
│   └── request.js             # 网络请求中间件
└── main.js                    # 入口文件 加载组件 初始化等

下面是文档内容

api/user.js(用户请求api)

// 引用网络请求中间件
import request from './../utils/request';
/***    登陆请求*/
export function login(data) {return request({url: '/user/login',method: 'POST',data})
}

store/modules/user.js(用户请求模块)

// 引用用户请求api
import {login} from '../../api/user';
import {setToken} from '../../utils/auth';//下面我是示例的微信小程序的参数，可自行修改请求参数
const actions = {login({commit}, param) {return new Promise((resolve, reject) => {login({iv: param.iv,		// 请求参数(可自行修改)code: param.code	// 请求参数(可自行修改)}).then(response => {// 这里可以自己添加方法// 保存获取到的token到本地之类的// 必须在resolve之前执行setToken(response.token)	//将获取到的token保存到本地resolve(response)}).catch(error => {console.log(error)})})}
};export default {namespaced: true,actions
}

store/index.js(状态管理初始化配置)

import Vue from 'vue'
import Vuex from 'vuex'
import user from './modules/user'Vue.use(Vuex)
const store = new Vuex.Store({modules: {user}
});export default store

utils/auth.js(本地缓存配置)

const TokenKey = 'token';// 认证令牌
export function getToken() {return uni.getStorageSync(TokenKey)
}export function setToken(token) {return uni.setStorageSync(TokenKey, token)
}export function removeToken() {return uni.removeStorageSync(TokenKey)
}

utils/env.js(公共参数)

"use strict";
// 变量可自行添加修改
export default { //存放变量的容器appid: '****',baseUrl: 'http://**.***.***.***'
}
/*** 	appid : 		小程序appid*  baseUrl : 		服务端域名*/

utils/request.js(网络请求中间件)

import {getToken,removeToken} from '../utils/auth';
import env from '../utils/env';function service(options = {}) {options.url = `${env.baseUrl}${options.url}`;// 判断本地是否存在token，如果存在则带上请求头if (getToken()) {options.header = {'content-type': 'application/json','Authorization': `${getToken()}`	// 这里是token(可自行修改)};}return new Promise((resolved, rejected) => {options.success = (res) => {// 如果请求回来的状态码不是200则执行以下操作if (res.data.code !== 200) {// 非成功状态码弹窗uni.showToast({icon: 'none',duration: 3000,title: `${res.data.msg}`});// 登陆失效if (res.data.code === 403) {// 清除本地tokenremoveToken()// 关闭所有页面返回到登录页uni.reLaunch({url: '/pages/login/login'})}// 返回错误信息rejected(res)} else {// 请求回来的状态码为200则返回内容resolved(res.data.data)}};options.fail = (err) => {// 请求失败弹窗uni.showToast({icon: 'none',duration: 3000,title: '服务器错误,请稍后再试'});rejected(err);};uni.request(options);});
}export default service;