尽管没有缓存标头，但最新的 Chrome 缓存 ajax 响应答案

【问题标题】：Latest Chrome caching ajax response despite no cache headers尽管没有缓存标头，但最新的 Chrome 缓存 ajax 响应
【发布时间】：2020-07-06 05:50:01
【问题描述】：

我有一个简单的模态表单，由 ajax 请求填充（到运行 Django 的服务器）

如果我将选项添加到选项字段，这些选项将在几分钟内不显示在模态框上。此问题仅在更新到最新版本的 chrome (80.3987.149) 后出现。

我在 ajax 响应中包含无缓存标头，如下所示：

    response['Cache-Control'] = 'no-cache, no-store, must-revalidate'
    response['Pragma'] = 'no-cache'
    response['Expires'] = '0'

但这似乎并不重要。

我的ajax调用方法如下：

openAlertModalOnclick(e) {
    e.preventDefault();
    let self = this;
    $.get($(e.target).attr("href"), resp => {
        $("#alertModal").html(resp.html).foundation("open").foundation();
        })
    }).fail(() => {
        this.showErrorToast("Error occurred while loading alerts.")
    })
}

我 90% 确定这只是最新版本的 chrome 的问题，因为在我更新 chrome 之前我无法重现它。我还能做些什么来让 chrome 停止缓存表单？

【问题讨论】：

标签： django ajax google-chrome frontend

【解决方案1】：

解决方案是将 $.get 调用更改为 $.ajax 并传入 cache: false 参数。

现在打开模态的函数如下所示：

    openForm52AlertModalOnclick(e) {
    e.preventDefault();
    let self = this;

    SpinnerController.showSpinner();

    $.ajax({
        url: $(e.target).attr("href"),
        method: 'GET',
        cache: false,
        success: function (resp) {
            $("#alertModal").html(resp.html).foundation("open").foundation();
        },
        error: function () {
            this.showErrorToast("Error occurred while loading alerts.")
        },

    });

【讨论】：