时间戳

首页 > 解决方案 > 如何在浏览器中缓存所有请求？

google-chrome - 如何在浏览器中缓存所有请求？

问题描述

我的 Webapp 是 React -> .NET -> SQL

我想缓存所有发布请求，以便所有 .NET 调用只进行一次，下次从缓存中获取。对于 react 中的每一个小的 UI 更改，我都想使用缓存并节省开发时间。

因为它只是为了开发，在 Chrome 中寻找或其他东西，是否有此类任务的扩展或任何我应该研究的指南都会有所帮助。

标签： google-chromegoogle-chrome-extensiongoogle-chrome-devtools

解决方案

如何使用chrome.storag.localAPI 来存储、检索和跟踪用户数据的更改。

您可以根据此SO post像这样使用它：

function fetchLive(callback) {
  doSomething(function(data) {
    chrome.storage.local.set({cache: data, cacheTime: Date.now()}, function() {
      callback(data);
    });
  });
}

function fetch(callback) {
  chrome.storage.local.get(['cache', 'cacheTime'], function(items) {
    if (items.cache && items.cacheTime && items.cacheTime) {
      if (items.cacheTime > Date.now() - 3600*1000) {
        return callback(items.cache); // Serialization is auto, so nested objects are no problem
      }
    }

    fetchLive(callback);
  });
}

请记住：

Chrome使用两个缓存——一个磁盘缓存和一个非常快的内存缓存。内存缓存的生命周期与渲染进程的生命周期相关联，渲染进程的生命周期大致对应于一个选项卡。从内存缓存响应的请求对 Web 请求 API 是不可见的。

推荐阅读