React API 调用状态永远挂起

Question

I am making API calls from my CRA (Create React App). Sometimes while opening a random page all of the API calls are showing the status of "pending" forever. When I refresh my page then, all the APIs work fine.

These are the details of the API in "pending" status.

const checkWelcomeRewardShown = async () => {
    try {
        if (localStorage.getItem("userType") === "student") {
            let res = await axios.get(`${process.env.REACT_APP_BASE_URL}/api/gethasnotseenintro`);
            if (res?.data?.status === "success" && res?.data?.notSeen) {
                await axios.get(`${process.env.REACT_APP_BASE_URL}/api/getunlocktokenuser`);

                await axios.get(`${process.env.REACT_APP_BASE_URL}/api/falsewhenfirstlogin`);
            }

            let response = await axios.get(`${process.env.REACT_APP_BASE_URL}/api/seenPopupForLinkedinAndFeedback`);
        }
    } catch (error) {}
};

useEffect(() => {
    checkWelcomeRewardShown();
    dispatch(showAllPopups());
}, [localStorage.getItem("user_id")]);

Answer 1

已解决。后端中有一个 API 失败，并且没有逻辑说明失败时应该发生什么。这就像一个到处都在使用的全局级别 API，所以当它失败时，它会阻止其余 API 的执行。这就是为什么所有这些都显示为“待处理”的原因。

React API 调用状态永远挂起

React API call status is pending forever

api

routes

node.js

reactjs

axios