如何将响应数据包含到 axios 响应中？

Question

我尝试使用 Axios 拦截器。我面临的问题是我无法使用 Axios 显示从 API 获得的响应，即使它显示了，它也显示了常量数据。

axios.defaults.baseURL = 'https://localhost:5001/api/';
axios.defaults.withCredentials = true;

const responseBody = res => res.data;

axios.interceptors.response.use(async response => {
    const pagination = response.headers["x-pagination"];
    if (pagination) {
        const parsed = JSON.parse(pagination);
        let metaData = {
            currentPage: parsed.currentPage,
            pageSize: parsed.pageSize,
            totalPages: parsed.totalPages,
            totalCount: parsed.totalCount
        };
        response.data = {
            metaData,
            data: response.data //I want to change this data
             // For example there is an endpoint named getAll and it returns all object
            //  Also there is a get endpoint and it returns a single object  
           //   But the problem is axios always return getAll endpoint's data.

        };
        return response;
    }
}, error => {
    return Promise.reject(error);
});

这是我的请求对象

const requests = {
    get: (url, params) => axios.get(url, {params}).then(responseBody),
    post: (url, data) => axios.post(url, data).then(responseBody),
    put: (url, data) => axios.put(url, data).then(responseBody),
    delete: (url) => axios.delete(url).then(responseBody),
    postForm: (url, data) => axios.post(url, data, {
        headers: {
            'Content-Type': 'multipart/form-data'
        }
    }).then(responseBody),
    putForm: (url, data) => axios.put(url, data, {
        headers: {
            'Content-Type': 'multipart/form-data'
        }
    }).then(responseBody)
};

这是我的 API 端点

const Endpoints = {
    getAll: () => requests.get('Endpoint'),
    get: (id) => requests.get(`Endpoint/${id}`),
    create: (data) => requests.postForm('Endpoint', data),
    update: (id, data) => requests.putForm(`Endpoint/${id}`, data),
    delete: (id) => requests.delete(`Endpoint/${id}`),
}

我错过了什么？另外，我使用 Redux Slice。你要的话我也可以发我写的redux代码

Answer 1

axios.interceptors.response.use(async response => {
    const pagination = response.headers["x-pagination"];
    if (pagination) {
        const parsed = JSON.parse(pagination);
        let metaData = {
            currentPage: parsed.currentPage,
            pageSize: parsed.pageSize,
            totalPages: parsed.totalPages,
            totalCount: parsed.totalCount
        };
        response.data = {
            metaData,
            data: response.data
        };
        return response;
    }
    return response; // problem solved after this
}, error => {
    return Promise.reject(error);
});

问题是我忘记了 return 响应，所以这就是为什么我总是得到相同的数据。

如何将响应数据包含到 axios 响应中？

How can I include response data to axios response?

reactjs

redux

axios