Refactor request formatting and configuration

This commit is contained in:
wangqiao
2025-08-27 14:32:39 +08:00
parent 64d0696cb9
commit 9acc229704
2 changed files with 75 additions and 101 deletions

View File

@ -1,87 +1,53 @@
import { useFetch } from "#app";
import type { UseFetchOptions } from "#app";
import { isArray } from "~/utils/utils";
import { useFetch } from '#app'
import type { UseFetchOptions } from '#app'
import { isArray } from '~/utils/utils'
const useServerRequest = async <T>(
url: string,
opts?: UseFetchOptions<T, unknown>
) => {
const token = useToken();
const user = useUserInfo();
const runtimeConfig = useRuntimeConfig();
const useServerRequest = async <T>(url: string, opts?: UseFetchOptions<T, unknown>) => {
const token = useToken()
const user = useUserInfo()
const runtimeConfig = useRuntimeConfig()
const defaultOptions: UseFetchOptions<unknown> = {
baseURL: runtimeConfig.public.apiBase,
onRequest({ options }) {
options.headers = options.headers || "application/json";
options.headers = options.headers || 'application/json'
if (token.value) {
console.log('user----', user.value);
console.log('token----', "Bearer " + token.value)
// @ts-ignore
options.headers["authorization"] = "Bearer " + token.value;
options.headers['authorization'] = 'Bearer ' + token.value
}
console.log(url +'-----' +'options----', options);
},
onResponse({ response }) {
if (+response.status === 200 && +response._data.code !== 0) {
process.client && ElMessage.error(response._data.msg);
process.client && ElMessage.error(response._data.msg)
}
},
onResponseError({ response }) {
process.client &&
ElMessage.error(
isArray(response._data.data.msg)
? response._data.data.msg[0]
: response._data.data.msg
);
process.client && ElMessage.error(isArray(response._data.data.msg) ? response._data.data.msg[0] : response._data.data.msg)
},
};
console.log(url + '-----' + 'defaultOptions----', defaultOptions);
console.log(url + '-----' + 'opts----', opts);
}
// return useFetch<T>(url, { ...defaultOptions, ...opts } as any);
// 明确转换返回类型
const response = await useFetch<T>(url, { ...defaultOptions, ...opts } as any);
console.log(url +'-----' + 'response----', response.data.value);
return response.data.value as unknown as T;
};
const response = await useFetch<T>(url, { ...defaultOptions, ...opts } as any)
return response.data.value as unknown as T
}
// GET请求
export const get = <T = unknown>(
endpoint: string,
config?: Omit<FetchOptions, 'method'>
): Promise<T> => {
console.log(endpoint + '----' + 'config----', config);
export const get = <T = unknown>(endpoint: string, config?: Omit<FetchOptions, 'method'>): Promise<T> => {
return useServerRequest<T>(endpoint, { ...config, method: 'GET' })
}
// POST请求
export const post = <T = unknown>(
endpoint: string,
body?: any,
config?: Omit<FetchOptions, 'method' | 'body'>
): Promise<T> => {
export const post = <T = unknown>(endpoint: string, body?: any, config?: Omit<FetchOptions, 'method' | 'body'>): Promise<T> => {
return useServerRequest<T>(endpoint, { ...config, method: 'POST', body })
}
// DELETE请求
export const del = <T = unknown>(
endpoint: string,
config?: Omit<FetchOptions, 'method'>
): Promise<T> => {
export const del = <T = unknown>(endpoint: string, config?: Omit<FetchOptions, 'method'>): Promise<T> => {
return useServerRequest<T>(endpoint, { ...config, method: 'DELETE' })
}
// PUT请求
export const put = <T = unknown>(
endpoint: string,
body?: any,
config?: Omit<FetchOptions, 'method' | 'body'>
): Promise<T> => {
export const put = <T = unknown>(endpoint: string, body?: any, config?: Omit<FetchOptions, 'method' | 'body'>): Promise<T> => {
return useServerRequest<T>(endpoint, { ...config, method: 'PUT', body })
}

View File

@ -6,13 +6,19 @@ export default defineNuxtConfig({
// },
devtools: {
enabled: process.env.NODE_ENV === "development",
enabled: process.env.NODE_ENV === 'development',
},
debug: process.env.NODE_ENV === "development", // 开启详细调试日志
debug: process.env.NODE_ENV === 'development', // 开启详细调试日志
ssr: true,
modules: ["@unocss/nuxt", "@pinia/nuxt", "@element-plus/nuxt",'pinia-plugin-persistedstate/nuxt','nuxt-swiper'],
css: ["@unocss/reset/tailwind.css", "element-plus/dist/index.css","~/assets/scss/app.scss"],
modules: [
'@unocss/nuxt',
'@pinia/nuxt',
'@element-plus/nuxt',
'pinia-plugin-persistedstate/nuxt',
'nuxt-swiper',
],
css: ['@unocss/reset/tailwind.css', 'element-plus/dist/index.css', '~/assets/scss/app.scss'],
vite: {
css: {
preprocessorOptions: {
@ -32,18 +38,17 @@ export default defineNuxtConfig({
},
},
optimizeDeps: {
include: ["naive-ui"],
include: ['naive-ui'],
},
// 生产环境构建优化
build: {
// 生产环境移除 console 和 debugger
minify: "esbuild",
target: "es2020",
minify: 'esbuild',
target: 'es2020',
},
esbuild: {
// 生产环境下移除所有 console 语句和 debugger
drop:
process.env.NODE_ENV === "production" ? ["console", "debugger"] : [],
drop: process.env.NODE_ENV === 'production' ? ['console', 'debugger'] : [],
},
},
@ -60,35 +65,38 @@ export default defineNuxtConfig({
// duration: 400,
// },
head: {
title: "图夕夕-世界图纸 夕夕共享",
title: '图夕夕-世界图纸 夕夕共享',
htmlAttrs: {
lang: "en",
lang: 'en',
},
meta: [
{ charset: "utf-8" },
{ name: "viewport", content: "width=device-width, initial-scale=1" },
{ charset: 'utf-8' },
{ name: 'viewport', content: 'width=device-width, initial-scale=1' },
{
name: "description",
content: "图夕夕是一家图纸素材分享交易平台提供AutoCAD/ProE/Creo/CATIA/UG/inventor/CAXA/等建筑图纸的素材下载及免费教程。",
name: 'description',
content:
'图夕夕是一家图纸素材分享交易平台提供AutoCAD/ProE/Creo/CATIA/UG/inventor/CAXA/等建筑图纸的素材下载及免费教程。',
},
{ name: "keywords", content: "图纸,图纸下载,设计素材,图纸大全,设计图纸,,工程图纸,cad图纸" },
{ name: "author", content: "图夕夕" },
{ name: 'keywords', content: '图纸,图纸下载,设计素材,图纸大全,设计图纸,,工程图纸,cad图纸' },
{ name: 'author', content: '图夕夕' },
// SEO meta tags
{ property: "og:title", content: "图纸,图纸下载,设计素材,图纸大全,设计图纸,,工程图纸,cad图纸" },
{
property: "og:description",
content: "图夕夕是一家图纸素材分享交易平台提供AutoCAD/ProE/Creo/CATIA/UG/inventor/CAXA/等建筑图纸的素材下载及免费教程。",
property: 'og:title',
content: '图纸,图纸下载,设计素材,图纸大全,设计图纸,,工程图纸,cad图纸',
},
{ property: "og:type", content: "website" },
{ property: "og:url", content: "https://www.xlcig.cn" },
{ property: "og:site_name", content: "xlCig" },
{ name: "theme-color", content: "#00f5ff" },
{
property: 'og:description',
content:
'图夕夕是一家图纸素材分享交易平台提供AutoCAD/ProE/Creo/CATIA/UG/inventor/CAXA/等建筑图纸的素材下载及免费教程。',
},
{ property: 'og:type', content: 'website' },
{ property: 'og:url', content: 'https://www.xlcig.cn' },
{ property: 'og:site_name', content: 'xlCig' },
{ name: 'theme-color', content: '#00f5ff' },
// robots meta
{ name: "robots", content: "index, follow" },
],
link: [
{ rel: "icon", type: "image/x-icon", href: "/favicon2.ico" },
{ name: 'robots', content: 'index, follow' },
],
link: [{ rel: 'icon', type: 'image/x-icon', href: '/favicon2.ico' }],
},
},
@ -98,25 +106,25 @@ export default defineNuxtConfig({
apiBase: 'https://tuxixi.net',
// 应用信息
appName: "xlCig",
appVersion: "1.0.0",
appName: 'xlCig',
appVersion: '1.0.0',
// 调试模式
debug: process.env.NODE_ENV === "development",
debug: process.env.NODE_ENV === 'development',
// 环境标识
environment: process.env.NODE_ENV || "development",
environment: process.env.NODE_ENV || 'development',
},
},
build: {
transpile: ["vueuc", "@css-render/vue3-ssr","@unocss","@tinymce/tinymce-vue","tinymce"],
transpile: ['vueuc', '@css-render/vue3-ssr', '@unocss', '@tinymce/tinymce-vue', 'tinymce'],
},
plugins: [
// 在这里引入插件
// { src: "~plugins/tinymce" ,ssr: false},
],
piniaPluginPersistedstate: {
storage: 'localStorage'
}
});
storage: 'localStorage',
},
})