如何强制 jQuery 向服务器发出 GET 请求以刷新缓存的资源

Question

网上有很多关于如何防止 jQuery AJAX 请求被缓存的答案。 这不是我想要做的。

我需要根据我的代码中的条件从缓存中返回 AJAX 请求。也就是在页面加载的时候发出请求，返回缓存的响应是完全可以的（其实是本意）。但是当用户单击一个按钮时，我需要从服务器刷新相同的请求。

我知道我可以通过在 jQuery 中设置 cache: false 选项来做到这一点，但这只会使用不同的 URL 请求数据，因此不会刷新缓存中的响应，并且在下一页使用 cache: true 加载请求将返回过时的数据。

我尝试在请求中添加 Cache-Control 标头，但至少在 IE10 中没有效果。

$.ajax({
    url: Configuration.ApiRootUri + "Notifications",
    type: "GET",
    headers: { 'Cache-Control': refreshCache ? 'no-cache' : 'private' },
    success: function(data) {}
});

是否可以强制浏览器从脚本刷新缓存的资源？

Answer 1

（注：在cmets讨论后重写）

一种解决方案是将来自服务器的响应存储在本地存储中，并在页面加载时加载它（如果存在）。

这完全避免了在启动时向服务器发出的请求，并且充当缓存，但在浏览器中。

这是一个伪算法示例：

function loadRequest(){
    Call Ajax request
        On success, store the result in the localstorage, call updateHtml(result);
}

function updateHtml(data) {
    Update the specific html (list, view, etc) with the data
}

$('#mybutton').on ('click', loadRequest);

$(function() {
    Check if the data in the localstorage exists
        if exists, call updateHtml(localstorage.value);
        else call loadRequest 
});

就是这样！