Html4瀏覽器不支持HTML5歷史API的history.pushState和history.replaceState方法

Question

我正在使用一個ember應用程序（使用ember-1.0.pre.js）。我試圖在IE8上提供跨瀏覽器兼容性。

問題是在每次轉換後都會生成url，這對用戶來說似乎是不正確/錯誤的。假設我點擊了像the_ domain_name/sell/new這樣的網址，最初讓我在我們的應用程序的銷售頁面上。然後我試圖通過一個叫做「購買」的新狀態，這個狀態將在我們申請的購買頁面上登陸。

新的狀態轉換在IE8地址欄中生成URL the_ domain_name/sell/new#/offers/purchase?&suid=1365149991779013736531657156165而不是the domain_name/offers/purchase。

注： the_domain_name = http://www.example.com

生成的URL包括兩個不正確的東西，

1. 最初的前綴 「/銷售/新＃」。

2. url查詢字符串中的參數「？& _suid = 1365149991779013736531657156165」。

我試圖找出問題，發現HTML4瀏覽器不支持從HTML5的History API中的pushState和replaceState方法。我如何提供對IE8的支持任何人都可以幫助我呢？

Answer 1

我建議History.js作爲填充工具的瀏覽器不支持歷史API：https://github.com/browserstate/history.js

它是工作在：

HTML5的瀏覽器：

• 火狐4+
• 鉻8+
• Opera 11.5
• Safari 5.0及
• 的Safari的iOS 4.3+

HTML4瀏覽器：

• IE 6，7，8，9
• 火狐3
• 歌劇10，11.0
• Safari 4
• Safari iOS 4.2,4 .1 4.0，3.2

添加​​&註冊一個history.js位置處理成灰燼你應用。

下面是我從原來的Ember.HistoryLocation（Full code）修改了部分

(function() { 
    var get = Ember.get, set = Ember.set; 
    var popstateFired = false; 
    Ember.HistoryJsLocation = Ember.Object.extend({ 
    initState: function() { 
     this.replaceState(this.formatURL(this.getURL())); 
     set(this, 'history', window.History); 
    }, 
    getState: function() { 
     return get(this, 'history').getState().state; 
    }, 
    pushState: function(path) { 
     History.pushState({ path: path }, null, path); 
    }, 
    replaceState: function(path) { 
     History.replaceState({ path: path }, null, path); 
    } 
    }); 
    Ember.Location.registerImplementation('historyJs', Ember.HistoryJsLocation); 
})(); 

然後在你的應用程序中使用該填充工具：

App.Router.reopen({ 
    location: 'historyJs' 
});