【问题标题】:How to fix the Error: Request failed with status code 404 in react如何修复错误:请求失败,状态码 404 反应
【发布时间】:2021-04-25 12:57:25
【问题描述】:

HOME.TSX

function Home() {
     const { getLatest } = useData();
        
            const [state, setState] = useState([]);
            useEffect(() => {
                const fetchData = async () => {
                    await getLatest().then((response) => setState(response['data'].data))
                };
        
                fetchData();
            }, []);
        
            console.log(state);
    return (<>TEST</>)

}

如何修复Error: Request failed with status code 404? 问题是当我重新加载页面时 url 错误它转到localhost:3000 而不是http://test.room.com:8030/api/latest 当我尝试保存我的代码时,它也是正确的。但是再次重新加载页面后,它会再次出现错误。

【问题讨论】:

  • getLatest 必须使用安装页面后可以获得的参数运行?
  • 但我设置了没有参数的 getLatest。
  • 您的问题范围很广,所以我只能给您一些示例,例如,您的请求可能使用您在页面重新加载后获得的令牌。它可以解释为什么当您重新加载时失败 404(令牌尚未获得)而当您保存代码时成功(令牌尚未获得)
  • 更新了问题
  • 您的 useEffect 仅在您重新加载页面时运行,您可以在保存代码时运行其他代码。 [](reactjs.org/docs/…)

标签: reactjs typescript next.js


【解决方案1】:

404 错误表示未找到请求的资源。在您的情况下,我假设您正在 getLatest() 方法中获取数据。我会仔细检查您的网址是否正确,以及您请求的服务器是否正在运行。

[https://developer.mozilla.org/en-US/docs/Web/HTTP/Status/404][更多信息]

【讨论】:

  • 网址正确。例如我运行应用程序然后我尝试保存我的代码然后它将在控制台上显示数据但是当我尝试重新加载页面时会显示错误但是当我再次保存我的代码时它会再次显示数据。跨度>
  • 如果服务器返回 404,您能否检查网络请求?重新加载似乎不太可能导致该错误。
  • 它转到 localhost:3000 而不是 http://test.room.com:8030/api/latest
  • 我添加了 setTimeout(() => {...}, 1000);现在它已经开始工作了。
猜你喜欢
  • 2020-09-18
  • 2019-10-12
  • 2019-11-05
  • 1970-01-01
  • 2019-08-15
  • 1970-01-01
  • 1970-01-01
  • 2020-08-30
  • 2021-04-09
相关资源
最近更新 更多