javascript - 以编程方式缓存和无效 XHR/Ajax 响应

Question

考虑一个网页有很多对服务器的 XHR 调用和一个 iframe，它再次包含对服务器的很多 XHR 调用。其中许多调用是相同的（冗余）。我确实有单个通信接口（即 javascript 对象中的一组方法）。

如何优化服务器调用？我们可以缓存响应吗？（当发生某些可能改变响应的操作时，我可以使存储的响应无效），此外，此缓存应在页面刷新后清除。有没有这样的组件/技术可用？

问候，
纳奇基特

Answer 1

某种形式的记忆。注意：您必须更改以下代码以适应您的 XHR 实现。由于您没有提供代码，因此不得不做出假设。

var cacheXHRWrapper = function ( url , handler ) {

   var cache = {};
   var queued = {};
   var pending = {};

   if ( cache[ url ] ) {

      handler( cache[ url ] );

   } else {

      queued[ url ] || ( queued[ url ] = [] ); // I know, call me lazy.
      queued[ url ].push( handler );

      if ( !pending[ url ] ) {

         // might want to adjust this to comply to your XHR implementation
         XHR_IMPL.request( url , function ( response ) {

            // cache response
            cache[ url ] = response;

            // serve all queued handlers.
            var fn = queued[ url ].shift();
            while ( fn ) {
               fn( response );
               fn = queued[ url ].shift();
            }

         } );

         pending[ url ] = true;

      }

   }
}

奖励，将已经运行的请求处理程序（通过 url）排队。