React Native - 获取缓存的提取

时间:2015-07-23 16:34:47

标签: caching reactjs fetch react-native

我正在使用react native构建一个应用程序,该应用程序使得获取调用依赖于来自服务器的最新信息。我注意到它似乎缓存了响应,如果我再次运行该fetch调用,它将返回缓存的响应,而不是来自我的服务器的新信息。

我的功能如下:

goToAll() {
  AsyncStorage.getItem('FBId')
    .then((value) => {
      api.loadCurrentUser(value)
        .then((res) => {
          api.loadContent(res['RegisteredUser']['id'])
            .then((res2) => {
              console.log(res2);
              this.props.navigator.push({
                component: ContentList,
                title: 'All',
                passProps: {
              content: res2,
            user: res['RegisteredUser']['id']
          }
        })
      });
    });
  })
  .catch((error) => {console.log(error);})
  .done();
}

来自api.js im调用的函数如下:

loadContent(userid){
  let url = `http://####.com/api/loadContent?User_id=${userid}`;
  return fetch(url).then((response) => response.json());
}

3 个答案:

答案 0 :(得分:37)

您可以设置Header以阻止缓存请求。 示例如下:

return fetch(url, {
  headers: {
    'Cache-Control': 'no-cache'
  }
}).then(function (res) {
  return res.json();
}).catch(function(error) {
  console.warn('Request Failed: ', error);
});

答案 1 :(得分:10)

Manosim的回答对我不起作用,但让我走上工作的解决方案之路:

fetch(url, {
  headers: {
    'Cache-Control': 'no-cache, no-store, must-revalidate',
    'Pragma': 'no-cache',
    'Expires': 0
  }
})

这钉了它。

答案 2 :(得分:0)

我在使用本机(Android)和使用clojurescript(而不是js)进行抓取时遇到了类似的问题。 添加:cache“ no-store”(不在标题中)可停止该行为(在Android App上缓存获取数据)。

我认为js中的代码应类似于:

fetch(url, {'cache':'no-store'})

specs fetch cache-mode