Javascriptを：再び要求前の状態にアクセスする

Question

私はJSでこれを使用します

window.history.replaceState({url: , scrollTop: wTop}, 'foo', 'bar'); 

をしかし、私はバックボタンを押して、ここから別のページに移動するとき、私は要求を発射されずに終わります。代わりに、私のブラウザは "ディスクキャッシュ"からすべてのものを読み込みます。私の状態は変化しており、修正されたページを求めなければならないので、私は再び要求を発射したいと思います。 どうすれば実現できますか？

私は、この私のレールのコントローラで試してみました：

response.headers['Cache-Control'] = 'no-cache, no-store, must-revalidate' 
response.headers['Pragma'] = 'no-cache' 
response.headers['Expires'] = '0' 

しかし、どうやら、履歴リストは、キャッシュ機能に全く関係ありません。

Answer 1

私は隠された入力と少しのスクリプトでやっています。次のようなもの、あなたが持っていると仮定すると利用できるjQueryの（あなたがそれを使用していない場合は、明らかにそれを修正する）：その後、

<input type="hidden" id="reload_page" value="false" /> 

そして：location.reloadで

$(document).ready(function() { 
    if ($("#reload_page").val() == "true") { 
     location.reload(true); 
    } else { 
     $("#reload_page").val("true"); 
    } 
} 

「真」のフラグをイベントは、キャッシュからではなくサーバーからページをリロードするように指示します。ブラウザは入力値をキャッシュの一部として保存する必要があります。そのため、ページは最初に読み込まれたときには表示されません。

代わりに追加されたページで作業していて履歴のない状態になっている場合は、上記のようにダイレクトリロードの代わりにプロセスを少し元に戻すことができます。以下のように、直接リロードするのではなく、何かを提出：スクリプトの同様のビットと組み合わせる

<form id="reload_form" method="get"> 
<input type="hidden" id="no_refresh" val="true" /> 
</form> 

：

$(document).ready(function() { 
    if (!$.urlParam('no_refresh')) { 
     $("#reload_form").submit(); 
    } 
}); 

これはhereを見つけ$ .urlParam機能を利用しているが、上で動作します自然な「バック」機能と同様の原理上記のスニペット - フォームがページをリフレッシュするために送信されると、パラメータが使用可能になり、変更された状態はスクリプトがページをリフレッシュするのを防ぎます。

Answer 2

pop state listenerを追加する必要があります。

window.onpopstate = function(event) { 
    alert("location: " + document.location + ", state: " + JSON.stringify(event.state)); 
}; 

あなたがこのリスナーを追加しない場合は、ブラウザは時に状態変化（キャッシュからまたはロード）サーバーからページを要求し、伝統的な方法で動作します。

注：ブラウザのキャッシュヘッダーは、最初のページの読み込みを改善するプッシュ/ポップ状態でも使用できます。