axios 为什么我从JSON在线文件获取请求在新渲染时不会刷新?

yuvru6vn  于 2022-11-05  发布在  iOS
关注(0)|答案(1)|浏览(163)

我正在对一个存储在Azure blob上的json文件执行以下请求。

const getDatas = () => {
    axios
      .get('https://randomname.blob.core.windows.net/public/data_home_page.json')
      .then(({ data }) => {
        setStats(data)}
        )
      .catch((er) => console.log('error'))
  }

我将此函数嵌套在useEffect挂接中,

useEffect(() => {
    getDatas()
  }, [])

它运行得很好,因为我可以获取数据并显示它。我的问题是它在页面/组件呈现时从不刷新。唯一的解决方案是清除缓存。
我怎样才能在不清空所有用户缓存的情况下强制调用获取最新数据?为了更好地理解为什么会这样?

1tu0hz3e

1tu0hz3e1#

如果您将正确的标头添加到Axios调用中,则应禁用该高速缓存。

headers: {
    'Cache-Control': 'no-cache',
    'Pragma': 'no-cache',
    'Expires': '0',
}

完整的Axios示例

axios.get(`https://randomname.blob.core.windows.net/public/data_home_page.json`, {
    headers: {
        'Cache-Control': 'no-cache',
        'Pragma': 'no-cache',
        'Expires': '0',
    }
    })
    .then(({ data }) => {
    setStats(data);
    })
    .catch((er) => console.log("error"));
};

示例:https://codesandbox.io/s/flamboyant-resonance-dhq2fi?file=/src/App.js

相关问题