当浏览器应用程序关闭并重新打开时,Android(移动)上的奇怪反应行为.(异步axios调用有时不运行?)



所以我正在构建一个全栈(Express和React(应用程序,它使用后端cookie进行身份验证等等。我遇到的问题是在安卓系统上,我的行为很奇怪;并且可能在任何移动设备上。以下是代码示例:

// React App.js
const App = () => {
const [user, setUser] = useState("");
const [auth, setAuth] = useState(false);
const checkIfLogged = async () => {
console.log('[CHECKIFLOGGED]')
try {
const user = await axios.get('/user/route/', {withCredentials: true})
setAuth(true)
setUser(user.data)
} catch (error) {
console.log(error)
}
};
useLayoutEffect(() => {
checkIfLogged();
})
return(
<>
{components example, not real code}
</>
)
}

因此,在本例中,一旦安装了应用程序,useEffect((就会调用checkIfLogged((,它会向后端发出axios请求,如果存在正确的cookie,则会返回用户并将其设置为该状态。并且"auth"状态也设置为true。例如,该状态变量可以控制条件组件。

所以问题来了。在桌面浏览器中,这运行得很棒!没有问题!状态设置正确;每次页面加载或刷新时,checkIfLogged((都会运行。在移动浏览器的Android上,状态是不可预测的。如果我在安卓浏览器上打开网站,然后从我的安卓浏览器关闭浏览器(因此完全滑动关闭(,然后重新打开我的浏览器;该网站以一种奇怪的缓存快速加载方式加载。当这种情况发生时,await axios.get((有时会运行,有时不会运行。但是,即使axios.get((在之后没有"运行"setAuth(true(setUser(user.data(,它仍然会像axios调用通过一样执行。。。尽管它从未发送过。我在后台使用morgan来查看所有http请求,而axios.get没有通过。这太烦人了。。。我正在建立的这个网站主要是为了让自己在安卓上观看。。。但我似乎找不到解决方案,而且网上也没有关于它的信息。

如有任何帮助,将不胜感激

实际上我认为我解决了这个问题;我将useLayEffect更改为useEffect;不管怎么说,那实际上是个打字错误。然后在我的index.js中,我将服务工作者设置为"未注册"。我认为serviceworker正在缓存HTTP请求以供离线使用;这就是我不想要的。

最新更新