2017-06-12 11 views
0

私はReactでアプリを構築していますが、アプリケーションのレイアウト/状態によってReact Routerを使用できないため、履歴JSを使用して管理できませんサイトのナビゲーション。History JS/.htaccess - すべてインデックスを作成してパスを保存する

handlePageChange = (event) => { 

    //stop default page change 
    event.preventDefault(); 

    const history = createHistory() 

    if(typeof(event.target.tagName) === "undefined") { 
     var newURL = window.location.pathname; 
    } else { 
     var newURL = event.target.getAttribute('href'); 
     history.push(newURL) 
    } 

    this.setState({ 
     activePage:newURL.replace('/','') 
    }) 

    setTimeout(function(){ 
     this.setState({ 
      sideNavState:"" 
     })    
    }.bind(this),300) 

} 

上記のコードは、ページをナビゲートするため正常に動作しますが、それは直接のリンクにアクセスすることになると、私は問題を持っている:私の最も外側の容器の中で私は、セットアップのナビゲーションを管理するために、次のコードをしました。例えば、私がmysite.com/page1にアクセスしようとすると、私はアプリケーション状態によって制御されているのでページを設定していないので、このサーバー上に要求されたURLが見つかりません。

私はすべてのページ(mysite.com/page1、mysite.com/page2など)がルートにある同じindex.htmlファイルを指しているようにしたいのですが、これに対して正しいアプローチは何でしょうか?

RewriteEngine On 
RewriteRule ^(.+)\.php$ index.html?page=$1 [L,QSA,NC] 

また、私はページナビゲーションのためにここに正しいアプローチを使用しています:私は条件を書き換えるが、その関与の構文で失われたビットはそれが仕事を得ることができていない午前の.htaccess以下を使用しました私は達成しようとしていますか?私は自分のアプリをホストするときだけ私はこの問題を取得し、localhost上でそれが私がそれをどのように動作することに注意する価値がある。

ありがとうございます!

+0

htaccessの正しいアプローチが不明です(他の誰かが必ず答えます)が、フロントエンドがすべてのルーティングを処理できるように、すべてをindex.htmlにワイルドカードしたいとします。 – SamHH

+1

これは非常に混乱した質問です。私は本当にあなたの尋ねるものについて確信していますか?それは反応する、PHP、htaccess、何ですか?正確に何をしたいのですが、正確には動かないものは何ですか?私はこれが[XY質問](https://meta.stackexchange.com/questions/66377/what-is-the-xy-problem)かもしれないと思う。あなたの実際の問題ではなくあなたの試行された解決策を尋ねる* – Liam

+0

はいSamhhは正しいですが、私はその道を守っていきたいと思っていました... –

答えて

0

私が後だったものが見つかりました:これはhere

今すぐ文書は、サブディレクトリのルートを探しているページを、このリンクのおかげで停止している

RewriteEngine On 
RewriteRule ^([^/d]+)/?$ index.html?id=$1 [QSA] 

、追加でバックサイトのルートに書き換えます。 path

関連する問題