历史HTML5和网页源

Question

我使用HTML5历史API，我有以下问题：

1. 转到我的应用程序：app.mysite.io
2. 使用历史API浏览（app.mysite。 io/hello等）。我不收取所有HTML页面，但只收取我需要的部分内容。
3. 关闭页面（Chrome中的CTRL + W）并重新打开（Chrome中的CTRL + SHIFT + T）
4. 此时，我只看到最后一个AjaxCall及其响应（部分内容，因为我认为它看起来像像ajax请求）。

我创建了一个路由器，它监听URL何时发生变化，但当页面关闭然后重新打开时，我无法检测到。

编辑： 我使用Symfony2中，我加载两个不同的模板，ajax-layout.html.twig或full-layout.html.twig

EDIT2 这是我的代码：

var Devmanager = { 
    environment: 'prod', 
    prefix: '', 
    name: '', 
    routes: [ 
     "dashboard/", 
     "project/add/", 
     "project/view\/(.*)\/", 
     "project/", 
     "team/add/", 
     "team/view\/(.*)\/", 
     "settings/upgrade/", 
     "settings/", 
     "help/support/", 
     "help/video/", 
     "help/suggest/" 
    ], 

    config: function(options){ 
     this.environment = options && options.environment; 
     this.name = options && options.name; 
     this.prefix = (this.environment === 'prod') ? '/' : '/app_dev.php/'; 

     Router.config({ mode: 'history', root: this.prefix}); 
    }, 


    register: function(){ 
     var that = this; 

     for(var i=0; i < that.routes.length; i++){ 
      (function(){ 
       const _route = that.routes[i]; 
       Router.add(_route, function() { 
        arg0 = (arguments[0]) ? arguments[0] : ''; 
        Devmanager.call({ 
         path: Router.root + _route.replace('(.*)', arg0), 
         method: "GET", 
         data: {}, 
         success: function(response, status, request){ 
          $("section#content").html(response); 
         } 
        }); 
       }); 
      })(); 
     } 
     Router.listen(); 
    }, 

    run: function(){ 
     this.register(); 
     this.bind(); 
    }, 

    bind: function(){ 
     $(document).on('click', '.nav-primary a, .navbar-nav a.upgrade, .main-menu a:not(.external), .nav-project a', function (e) { Devmanager.goto(e) }); 
    }, 

    call: function(options){ 
     NProgress.start(); 
     $.ajax({ 
      url: options.path, 
      data: options.data, 
      method: options.method, 
      success: options.success, 
      error: options.error && function(){ 
       location.href = Router.root; 
      }, 
      complete: function (request) { 
       Devmanager.toolbar(request); 
       NProgress.isStarted() && NProgress.done(); 
      } 
     }); 
    }, 

    goto: function(e){ 
     var $this = $(e.target); 
     $this.is('a') || ($this = $this.closest('a')); 
     if(!$this.next().is('ul')) Router.navigate($this.attr('href')); 
     e.preventDefault(); 
    }, 

    toolbar: function(request){ 
     if (typeof Sfjs === "undefined" || this.environment === 'prod') return; 

     var sf = $('.sf-toolbar')[0]; 
     var xdebugToken = request.getResponseHeader('X-Debug-Token'); 
     Sfjs.load(sf.id, '/app_dev.php/_wdt/'+ xdebugToken); 
    } 
}; 

var Router = { 
    routes: [], 
    mode: null, 
    root: '/', 

    config: function(options) { 
     this.mode = options && options.mode && options.mode == 'history' 
     && !!(history.pushState) ? 'history' : 'hash'; 
     this.root = options && options.root ? options.root : '/'; 
     return this; 
    }, 

    getFragment: function() { 
     var fragment = ''; 
     if(this.mode === 'history') { 
      fragment = this.clearSlashes(decodeURI(location.pathname + location.search)); 
      fragment = fragment.replace(/\?(.*)$/, ''); 
      fragment = this.root != '/' ? fragment.replace(this.root, '') : fragment; 
     } else { 
      var match = window.location.href.match(/#(.*)$/); 
      fragment = match ? match[1] : ''; 
     } 
     return this.clearSlashes(fragment); 
    }, 

    clearSlashes: function(path) { 
     return path.toString().replace(/\/$/, '').replace(/^\//, ''); 
    }, 

    add: function(re, handler) { 
     if(typeof re == 'function') { 
      handler = re; 
      re = ''; 
     } 
     this.routes.push({ re: this.clearSlashes(this.root + re), handler: handler}); 
     return this; 
    }, 

    remove: function(param) { 
     for(var i=0, r; i<this.routes.length, r = this.routes[i]; i++) { 
      if(r.handler === param || r.re.toString() === param.toString()) { 
       this.routes.splice(i, 1); 
       return this; 
      } 
     } 
     return this; 
    }, 

    flush: function() { 
     this.routes = []; 
     this.mode = null; 
     this.root = '/'; 
     return this; 
    }, 

    check: function(f) { 
     var fragment = f || this.getFragment(); 
     for(var i=0; i<this.routes.length; i++) { 
      var match = fragment.match(this.routes[i].re); 
      if(match) { 
       match.shift(); 
       this.routes[i].handler.apply({}, match); 
       return this; 
      } 
     } 
     return this; 
    }, 

    listen: function() { 
     var self = this; 
     var current = self.getFragment(); 
     var fn = function() { 
      if(current !== self.getFragment()) { 
       current = self.getFragment(); 
       self.check(current); 
      } 
     }; 
     clearInterval(this.interval); 
     this.interval = setInterval(fn, 50); 
     return this; 
    }, 

    clearRoot: function (path) { 
     return path.replace(this.root, ''); 
    }, 

    navigate: function(path) { 
     path = (path == undefined) ? '' : this.clearRoot(path); 
     if(this.mode === 'history') { 
      History.pushState(null, Devmanager.name, this.root + this.clearSlashes(path) + '/'); 
     } else { 
      window.location.href.match(/#(.*)$/); 
      window.location.href = window.location.href.replace(/#(.*)$/, '') + '#' + path; 
     } 
     return this; 
    } 
}; 

Answer 1

我解决，我正在写对于具有相同问题的用户：

插入选项cache:false在$ .ajax方法如下：

$.ajax({ 
    url: options.path, 
    data: options.data, 
    method: options.method, 
    success: options.success, 
    cache: false, 
    error: options.error && function(){ 
     location.href = Router.root; 
    }, 
    complete: function (request) { 
     Devmanager.toolbar(request); 
     NProgress.isStarted() && NProgress.done(); 
    } 
});