javascript - jQuery/Backbone 和 Firefox 与 Chrome HTTP 请求

标签 javascript jquery backbone.js

标题有点晦涩,但这里是......

我有一个 Backbone UI,它在页面加载时对 API 进行大量调用。它使用 Backbone Fetch Cache 来缓存 GET 请求。在 Chrome 上,缓存未命中意味着当对同一 URL 执行多个 GET 请求时,Chrome 会同时导致重复的 XHR 等待,直到第一个请求完成,然后后续请求才会命中缓存。

在 Firefox 中,所有 XHR 都会立即处理,即使它们是针对同一 API 端点的 GET 请求。从代码中重构它会很痛苦,所以问题是:

问题:

是否有现有方法可以修补 Backbone 或 jQuery 的sync() 部分,以便在所有浏览器中使用 Chrome 行为?这样 Firefox 就会等待第一个重复的 GET 请求,然后再处理其他请求?

最佳答案

您可以修改Backbone.ajax来创建请求列表,并等待第一个请求完成,然后再发出后续请求。例如

//cached requests
Backbone.xhrs = {};

Backbone.ajax = function(opts) {
    // cache GET requests, not the others
    if (opts.type!=='GET')
        return Backbone.$.ajax.apply(Backbone.$, arguments);

    var xhr;

    // issue the request if a cached version does not exist
    if (!Backbone.xhrs[opts.url]) {
        xhr = Backbone.xhrs[opts.url] = Backbone.$.ajax.call(Backbone.$, opts);
    } else {
        xhr = Backbone.xhrs[opts.url].then(function() {
            return Backbone.$.ajax.call(Backbone.$, opts);
        });
    }

    return xhr;
};

还有一个演示 http://jsfiddle.net/nikoshr/vexNP/

关于javascript - jQuery/Backbone 和 Firefox 与 Chrome HTTP 请求,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21574767/

相关文章:

javascript - 使用母版页避免 Javascript 中的重复

javascript - 为什么我的模型中的默认属性返回未定义

backbone.js - 如果您知道模型,请查找 Backbone.js View ?

javascript - Bootstrap Accordion 不会关闭所有列表项

javascript - Safari 删除表单标签

javascript - addEventListener 在使用匿名函数传入参数时为同一个句柄触发多次

javascript - Angular 5 服务替换/覆盖

javascript - $_POST 没有从 jQuery.post 填充的表单中提取值

javascript - 使用 VueX Store 中的计算属性进行 Ajax 调用的正确方法是什么

jquery - Sinatra 不发送 header