Javascript 从服务器随机提取数据会停止提取

Javascript 从服务器随机提取数据会停止提取,javascript,reactjs,asynchronous,fetch-api,Javascript,Reactjs,Asynchronous,Fetch Api,我的程序中发生了一些非常奇怪的事情。我有控制台。记录了它的垃圾与时间戳,试图找出发生了什么。基本上,我的程序会随机停止获取数据。我已确保有一个新的数据流,但我必须刷新整个页面或重新保存程序,以便在挂起时重新启动所有内容。最重要的是,没有错误或标志告诉我它为什么停止。我试图隔离这个问题,但很可能与异步函数有关。这是代码 function App() { const data = async() => { try { console.log('try block

我的程序中发生了一些非常奇怪的事情。我有控制台。记录了它的垃圾与时间戳,试图找出发生了什么。基本上,我的程序会随机停止获取数据。我已确保有一个新的数据流,但我必须刷新整个页面或重新保存程序,以便在挂起时重新启动所有内容。最重要的是,没有错误或标志告诉我它为什么停止。我试图隔离这个问题,但很可能与异步函数有关。这是代码

function App() {

  const data = async() => {
    try {
        console.log('try block initiated')
        const apiResponse = await fetch(ipAddress)
        console.log(apiResponse);
        console.log("BBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBB")
        const responseText = await apiResponse.text();
        console.log(responseText)
        console.log("CCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCC")
        if (loading === true){
            setLoading(false);
        }
        console.log("DDDDDDDDDDDDDDDDDDDDDDDDDDDDDD")
        return responseText;
    } catch (error) {
        console.log('catch initiated')
        setError(true);
    }
  };
  console.log("AAAAAAAAAAAAAAAAAAAAAAA")
  try{
      console.log("EEEEEEEEEEEEEEEEEEEEEEEEEEE")
    data().then(response=>setMoisture(response));
    console.log("FFFFFFFFFFFFFFFFFFFFFFFFFFFFFFF")
  } catch(error){
    console.log('gotcha')
    setError(true);
}
  
  let value = moisture;
  console.log(value);
  count += 1;  
  console.log(count);


  return(
    <div className="App">
      <WeatherCard moisture={value}/>    
    </div>
  );
}
函数应用程序(){
常量数据=异步()=>{
试一试{
console.log('try block initiated')
const apiResponse=等待获取(ipAddress)
控制台日志(apiResponse);
控制台日志(“bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb
const responseText=等待apiResponse.text();
console.log(responseText)
控制台日志(“CCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCC
如果(加载===true){
设置加载(假);
}
console.log(“dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd”)
返回响应文本;
}捕获(错误){
console.log('捕获已启动')
设置错误(真);
}
};
控制台日志(“aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
试一试{
console.log(“eeeeeeee”)
数据()。然后(响应=>setweather(响应));
console.log(“fffffffffffffffffffffffffffffffff”)
}捕获(错误){
console.log('gotcha')
设置错误(真);
}
let值=湿度;
console.log(值);
计数+=1;
控制台日志(计数);
返回(
);
}
下面是控制台在停止获取新数据之前的样子。。。
这里有一个可能的解决方案。在经历了许多头痛和研究异步函数之后。我想这会奏效的。我打算让它运行一整晚,看看它是否会被赶上,但到目前为止,这里是解决方案

const data = async() => {
try {
    const apiResponse = await fetch(ipAddress)
    const responseText = await apiResponse.text();
    console.log("CCCCCCCCCCCCCCCCCCC");
    console.log(responseText);
    if (loading === true){
        setLoading(false);
    }
    data().then(response=>setMoisture(response));
    return responseText;
} catch (error) {
    console.log("EEEEERRRRRRRRRROOOOOOOOOOORRRRRRRRRRRR")
    setError(true);
    }   
};
console.log("AAAAAAAAAAAAAAAAAAAA");
if (moisture === "initialState"){
    data().then(response=>setMoisture(response));
}else{
    console.log("QQQQQQQQQQQQQQQQQQQQQQQQ")
}

这是我改变的。。。我做了一个初始状态,叫做“初始化,如果变量是此值,则运行异步函数。然后,我再也不会在ASYNS本身之外调用此异步。相反,我在从函数返回值之前调用它自己。这是因为我的程序正在运行,而异步函数正在运行。然而,程序本身是顺序的,异步程序本身也是顺序的。它们不是顺序排列在一起的。因此,异步函数现在仅在异步函数完成第一次运行后再次被调用。同时,我的程序的其余部分正在运行。在此之前,我认为它被捕获是因为我的程序试图在第一次完成异步函数之前调用它。这是一个纯粹的猜测,因为我没有办法证明这一点,但它是有意义的。如果通宵运行失败。我将从解决方案中提取这个。否则,我认为这会奏效。祝你好运

有人知道是什么导致React js这样做吗。这是一致的,因为它最终会发生,但不一致的事实是,它似乎发生在不同的时间。有时它发生在10次数据检索之后,其他时间为100次,其他时间为276次等等…看起来像是具有相同值的设置状态。看看我对这个问题的回答。我不太确定你在这里的预期行为是什么。若您想要轮询该API并获得不间断的湿度更新,您可以增加计数器并将其设置为状态。这将确保触发下一轮重新渲染。另一方面,如果将湿度设置为相同的值,它将停止。奇怪的是,上面提到的怪癖,让你相信设置相同的状态值会触发重新渲染。不,不会的。这很有趣,但是,我的解决方案奏效了。它过去在5分钟内停止渲染,昨天运行了12个小时,没有任何问题。我有点困惑,为什么这是一个问题,因为我肯定得到了相同的价值观很多次在行,它没有停止反应。不管怎样,我很高兴它起作用了。