英文:
How to much time take a request in javascript axios?
问题
我有一个应用程序，从API获取数据，一切正常运行，但我想知道请求花费了多少时间，所以我使用了axios的拦截器（interceptors），我得到了以毫秒为单位的时间，但问题是我获得的request-duration是在请求响应之后，这对我来说没有用，我想要在调用web服务之前或在调用web服务时知道时间，让我感到困惑的是我调用的方法位于另一个文件中：
Request.js
export const getRequest = async (url, baseURL, headers) => {
const HTTP = axios.create({
baseURL,
headers,
});
HTTP.interceptors.request.use((config) => {
config.headers["request-startTime"] = new Date().getTime();
return config;
});
HTTP.interceptors.response.use((response) => {
const currentTime = new Date().getTime();
const startTime = response.config.headers["request-startTime"];
response.headers["request-duration"] = currentTime - startTime;
return response;
});
return HTTP.get(url);
};
Users.vue
async getUsers() {
try {
let url = `/users`;
let baseUrl = `baseURL`;
let headers = {};
const responseUsers = await getRequest(url,baseUrl,headers);
console.log(responseJobTasks.headers["request-duration"]); // 在这里显示多少毫秒
if (responseJobTasks.status === 200) {
const { data } = responseJobTasks;
this.users = data;
}
} catch (error) {
console.error(error);
}
}
英文:
I've an application where I get the data from an API, every things is working fine, but I want to know how much time a request take in times, so I've used the interceptors from axios and I get the time in milleseconds, BUT the problem is that the time I get request-duration is after the request respond which is not useful I want to know the time before or at calling the webservice, the thing make it hard for me is that the method I call is located in another file:
Request.js
export const getRequest = async (url, baseURL, headers) => {
const HTTP = axios.create({
baseURL,
headers,
});
HTTP.interceptors.request.use((config) => {
config.headers["request-startTime"] = new Date().getTime();
return config;
});
HTTP.interceptors.response.use((response) => {
const currentTime = new Date().getTime();
const startTime = response.config.headers["request-startTime"];
response.headers["request-duration"] = currentTime - startTime;
return response;
});
return HTTP.get(url);
};
Users.vue
async getUsers() {
try {
let url = `/users`;
let baseUrl = `baseURL`;
let headers = {};
const responseUsers = await getRequest(url,baseUrl,headers);
console.log(responseJobTasks.headers["request-duration"]); //show how much milleseconds here
if (responseJobTasks.status === 200) {
const { data } = responseJobTasks;
this.users = data;
}
} catch (error) {
console.error(error);
}
}
答案1
得分: 1
你可以通过获取前后时间戳来简单地了解它：
const before = Date.now();
const responseUsers = await getRequest(url, baseUrl, headers);
const after = Date.now();
const duration = after - before;
另一个选项是User Timing API，但对于计时单个请求来说可能有点过度。
英文:
You can know it simply by taking the timestamp of the before and after:
const before = Date.now();
const responseUsers = await getRequest(url,baseUrl,headers);
const after = Date.now();
const duration = after-before;
Another option is the User Timing API, but it is overkill for timing a single request.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论