feat: 接口请求测试,打包路径、开发请求路径完善

This commit is contained in:
wf 2024-10-08 15:14:10 +08:00
parent 987835ecde
commit 77aa6c7704
10 changed files with 66 additions and 31 deletions

View File

@ -1,7 +1,10 @@
# 开发环境 # 开发环境
VITE_USER_NODE_ENV = development VITE_USER_NODE_ENV = development
# 开发环境地址前缀 (一般 '/' 或 './' 都可以,如果开发环境 '/' 打包预览白屏,请使用 './') # 打包路径 开发环境地址前缀 (一般 '/' 或 './' 都可以,如果开发环境 '/' 打包预览白屏,请使用 './')
VITE_PUBLIC_PATH = './' VITE_PUBLIC_PATH = './'
# 请求路径 管理系统/开发环境
VITE_APP_BASE_URL = '/your-request-path'
VITE_GLOB_APP_TITLE = SnowAdmin VITE_GLOB_APP_TITLE = SnowAdmin

View File

@ -4,4 +4,7 @@ VITE_USER_NODE_ENV = production
# 打包路径 (就是网站前缀, 例如部署到 http://dcodes.gitee.io/SnowAdmin/ 域名下, 就需要填写 /SnowAdmin/), 一般填一个斜杠 / # 打包路径 (就是网站前缀, 例如部署到 http://dcodes.gitee.io/SnowAdmin/ 域名下, 就需要填写 /SnowAdmin/), 一般填一个斜杠 /
VITE_PUBLIC_PATH = '/' VITE_PUBLIC_PATH = '/'
# 请求路径 管理系统/开发环境
VITE_APP_BASE_URL = '/'
VITE_GLOB_APP_TITLE = SnowAdmin VITE_GLOB_APP_TITLE = SnowAdmin

View File

@ -1,7 +1,10 @@
# 开发环境 # 开发环境
VITE_USER_NODE_ENV = development VITE_USER_NODE_ENV = test
# 开发环境地址前缀 (一般 '/' 或 './' 都可以) # 开发环境地址前缀 (一般 '/' 或 './' 都可以)
VITE_PUBLIC_PATH = '/test' VITE_PUBLIC_PATH = '/test'
# 请求路径 管理系统/开发环境
VITE_APP_BASE_URL = '/'
VITE_GLOB_APP_TITLE = SnowAdmin VITE_GLOB_APP_TITLE = SnowAdmin

View File

@ -2,7 +2,7 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/src/assets/svgs/snow.svg" /> <link rel="icon" type="image/svg+xml" href="/src/assets/logo/snow.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title><%= title %></title> <title><%= title %></title>
</head> </head>

View File

@ -1,17 +1,15 @@
import axios from "axios"; import axios from "axios";
import { useRouter } from "vue-router"; import router from "@/router";
const router = useRouter(); import { Message } from "@arco-design/web-vue";
// 创建axios实例 // 创建axios实例
const service = axios.create({ const service = axios.create({
baseURL: "https://mock.apifox.com/m1/4457302-4103374-default", baseURL: "/api"
timeout: 5000
}); });
// 请求拦截器 // 请求拦截器
service.interceptors.request.use( service.interceptors.request.use(
function (config: any) { function (config: any) {
// 发送请求之前做什么 // 发送请求之前做什么
// 获取token鉴权 // 获取token鉴权
console.log("token?", localStorage.getItem("user-info"));
let userInfo: any = {}; let userInfo: any = {};
if (localStorage.getItem("user-info")) { if (localStorage.getItem("user-info")) {
userInfo = JSON.parse(localStorage.getItem("user-info") as string); userInfo = JSON.parse(localStorage.getItem("user-info") as string);
@ -19,12 +17,6 @@ service.interceptors.request.use(
if (userInfo.token) { if (userInfo.token) {
// 有token在请求头中携带token // 有token在请求头中携带token
config.headers.Authorization = userInfo.token; config.headers.Authorization = userInfo.token;
} else {
// 如果没有token则不允许发送请求并且跳转至登录页要求登录获取对应的token
if (config.url !== "/login") {
router.push("/login");
Promise.reject("未登录");
}
} }
return config; return config;
}, },
@ -37,11 +29,27 @@ service.interceptors.request.use(
// 响应拦截器 // 响应拦截器
service.interceptors.response.use( service.interceptors.response.use(
function (response: any) { function (response: any) {
return response.data; if (response.status != 200) {
Message.error("服务器异常,请联系管理员");
return Promise.reject(response.data);
}
let res = response.data;
if (res.code == 401) {
Message.error("登录状态已过期");
router.push("/login");
return Promise.reject(res);
} else if (res.code == 404) {
Message.error("请求连接超时");
return Promise.reject(res);
} else if (res.code != 200) {
Message.error(res.msg);
return Promise.reject(res);
} else {
// 返回数据
return Promise.resolve(res);
}
}, },
function (error: any) { function (error: any) {
console.log("响应拦截", error, router);
console.log("身份信息过期");
localStorage.removeItem("user-info"); localStorage.removeItem("user-info");
router.push("/login"); router.push("/login");
return Promise.reject(error); return Promise.reject(error);

View File

@ -1,4 +0,0 @@
import axios from "@/api";
// 第三板指标
export const getTargetAPI = () => axios.get("/notice-list");

10
src/api/modules/login.ts Normal file
View File

@ -0,0 +1,10 @@
import axios from "@/api";
// 登录
export const LoginAPI = (data: any) => {
return axios({
url: "store/store.php?action=Login",
method: "post",
data
});
};

1
src/assets/logo/snow.svg Normal file

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 5.5 KiB

View File

@ -41,6 +41,7 @@
import { Message } from "@arco-design/web-vue"; import { Message } from "@arco-design/web-vue";
import { useRouter } from "vue-router"; import { useRouter } from "vue-router";
import { useUserInfoStore } from "@/store/modules/user-info"; import { useUserInfoStore } from "@/store/modules/user-info";
const router = useRouter(); const router = useRouter();
const form = ref({ const form = ref({
username: "admin", username: "admin",
@ -102,16 +103,19 @@ const verify = ref({
}); });
const verifyCodeChange = (code: string) => (verify.value.verifyCode = code); const verifyCodeChange = (code: string) => (verify.value.verifyCode = code);
const onSubmit = ({ errors }: any) => { const onSubmit = async ({ errors }: any) => {
if (errors) return; if (errors) return;
// //
// ......
// -
let stores = useUserInfoStore(); let stores = useUserInfoStore();
let account = { let account = {
username: form.value.username, username: form.value.username, //
roles: ["admin"] roles: ["admin"] //
}; };
stores.setAccount(account); stores.setAccount(account); //
stores.setToken("DC-Admin"); stores.setToken("Your-Token");
Message.success("登录成功"); Message.success("登录成功");
router.replace("/home"); router.replace("/home");
}; };

View File

@ -18,12 +18,19 @@ export default defineConfig(({ mode }) => {
// 获取跟路径对应的文件 // 获取跟路径对应的文件
const env = loadEnv(mode, root); const env = loadEnv(mode, root);
return { return {
// 开发或生产环境服务的公共基础路径 // 生产环境服务的公共基础路径-用于生出环境的代理的路径
base: env.VITE_PUBLIC_PATH, base: env.VITE_PUBLIC_PATH,
server: { server: {
// host: "0.0.0.0", host: "0.0.0.0",
// open: true, open: true,
proxy: {} // 为开发服务器配置自定义代理规则-用于开发时的代理
proxy: {
"/api": {
target: env.VITE_APP_BASE_URL,
changeOrigin: true,
rewrite: path => path.replace(/^\/api/, "")
}
}
}, },
plugins: [ plugins: [
vue(), vue(),