Vue3 发送get 请求 携带数据
export function Team(data = {}) {
return service.request({
method: "get",
url: "https://example.com/api/endpoint", // 替换成实际的API端点
params: {
param1: data.param1, // 根据传入的参数动态构建
param2: data.param2
}
})
.then(response => {
// 请求成功,处理响应数据
return response.data;
})
.catch(error => {
// 请求失败,处理错误
console.error("请求失败:", error);
throw error; // 可以选择抛出错误,以便在调用方处理
});
}
/api/account.js
import service from "@/utils/request"; // 引入拦截器
export function Register(data = {}) {
return service.request({
method: "post",
url: "/users/register/",
data
});
}
export function Login(data = {}) {
return service.request({
method: "post",
url: "/users/login/",
data
});
}
export function Logout(data = {}) {
return service.request({
method: 'post',
url: "/users/logout/",
data
})
}
// export function Team(data = {}) {
// return service.request({
// method: "get",
// url: "/users/team/",
// params: {
// 'team': data.team, // 根据您的需求传递参数
// }
// params: data
// })
// }
export function Team(data = {}) {
return service.request({
method: "get",
url: "/users/team/",
params: data
})
}
拦截器 /utils/request.js
import axios from "axios";
// ElementUI 单独引入
import {ElMessage} from "element-plus";
// vue-router
import router from "@/router";
// cookies
import {getToken, getUsername, removeToken, removeUsername} from '@/utils/cookies'
// 创建实例
const service = axios.create({
// baseURL: "/devApi", // 请求地址
baseURL: process.env.VUE_APP_API, // 请求地址
timeout: 5000 // 超时
});
// console.log(process.env.VUE_APP_API)
// 拦截器
// 添加请求拦截器
service.interceptors.request.use(
function (config) {
// console.log("config:",config)
// 在发送请求之前做些什么
if (getToken()) {
config.headers['Token'] = getToken()
}
if (getUsername()) {
config.headers['Username'] = getUsername()
}
// console.log("config:", config);
// config.params = {'team':'test'}
return config;
},
function (error) {
// 对请求错误做些什么
console.log("service,error:", error);
return Promise.reject(error);
});
// 添加响应拦截器
service.interceptors.response.use(
function (response) {
// 对响应数据做些什么
// console.log("response:", response.data);
const data = response.data;
// console.log("data:", data);
if (data.resCode === 0) {
return Promise.resolve(data);
} else {
ElMessage({
message: data.message,
type: "error"
});
return Promise.reject(data.error);
}
},
function (error) {
// 对响应错误做些什么
// console.log("error:", error.request); // HMLHttpRequest...
const errorData = JSON.parse(error.request.response);
// console.log("errorData:", errorData); // {code:....}
if (errorData.message) { // 判断是否有 message 属性
ElMessage({
message: errorData.message,
type: "error"
});
}
// token 失效自动退出
if (errorData.resCode === 1010) {
router.replace({
name: "Login"
})
removeToken();
removeUsername();
}
// 对响应错误做些什么
return Promise.reject(error);
}
);
// 暴露service
export default service;