2016-08-02 15 views
0

私は単一ページアプリケーションを構築中です。アプリケーション状態を管理するためにHistory.jsを使用したいと考えています。私は、リンクとそれに応じてルーティングされているビューをクリックして作業する限り、望みどおりに動作します。問題は、私が場所を変更したURLルートで画面をリフレッシュするときです。私が知っているのは、私のサーバが/をキャプチャしていて、サーバ上のディレクトリを見つけようとしているからです。 #を使う前にこの問題に遭遇したことはありません!または#を使用してクライアント側のパラメータを区切ります。シングルページアプリケーション用History.jsの使用

app.html/madeUpPage/

私のサーバーは、リンクを介してリフレッシュまたはエントリが発生したときにmadeUpPageディレクトリを検索しようとしています。 HistoryJSを使ってクライアント側のシングルページアプリケーションでこれをどのように回避しますか?

index.htmlを、それがのparamsを解析し、URLのこの構成では期待通りに実行されるスクリプトの中に含まれるクライアントの負荷: app.html#madeUpPage

私は歴史としかしHistory.options.html4Mode = trueともwindow.History = { options: { html4Mode: true} }を試してみました。 js v1.8b2これは私にとってはうまくいかないようです。いくつかの助けを提供することができます誰にでもForce html4 fallback in history.js

ありがとう:

'use strict'; 
window.History = {options: {html4Mode: true} }; 
require(['js/client-config.js', 
     'js/lib/history-nativejs.js',  // History.js in raw JavaScript, very nice 3rd party utility... used for routing 
     'js/lib/libweb-ui.js', 
     'js/lib/libweb-ajax.js', // LibWeb ajax 
     'js/lib/libweb-jsml.js', // This is the file needed for JSML to run, parse and render your application (main core file) 
     'js/model.js', 
     'js/portfolio.js', // Main class containing viewstate 
     'js/global.js', // The global view model shared for all views in the SPA 
     'js/index.js', // The initial payload required to load the default application content (index/default.js) 
     'js/router.js', 
     'js/layout.js', 
     ], // This takes the raw JavaScript objects places them how they will appear in the layout (the "master page") 


      function coreScriptsLoadedSuccess() { 

      require(['js/controller.js'], function(){ 

       var appController = new PortfolioClientController(defaultAppState); 

       require(['js/events.js'], function domLoadSuccess(){ 
       }); 

      }); 
}); 

は、私はまた、このスレッドを試してみました。

答えて

0

?歴史を経てURLにpushStateのJSがこの問題を解決しました!だから、代わりに

..

**Before** 

click (()=> History.pushState({ 
      route: route 
      }, document.title + ' '+ route, 
      route); 
**Now** 

click (()=> History.pushState({ 
      route: route 
      }, document.title + ' '+ route, 
      `?view=${route}`); 
関連する問題