Single Page Application(SPA)ページを強制的に更新する方法は?
2023-07-20 11:31:07
質問
完全なサーバーサイドベースのレンダリング (非 Web 2.0) では、サーバーサイドのコードをデプロイすると、ページの再読み込み時にクライアントサイドのページが直接更新されます。これに対して、React ベースの Single Page Application では、React コンポーネントが更新された後でも、古いバージョンのコンポーネントを使用しているクライアントがあります (彼らはブラウザの再読み込み時にのみ新しいバージョンを取得します。これはほとんど発生しないはずです)。
古いバージョンのコンポーネントがどのクライアントによってももう使用されないことを確認するために、どのようなテクニックを採用すべきでしょうか?
更新:APIは変更せず、React Componentのみを新しいバージョンに更新します。
解決方法は?
アプリケーションのロード時に、Reactコンポーネントがサーバーにajaxリクエストを行い、以下のものを取得することができます。
"インターフェイスのバージョン"。
. サーバーAPIでは、クライアントバージョンの増分値を維持することができます。Reactコンポーネントは、この値をクライアントに保存できます(クッキー/ローカルストレージ/その他)。変更を検出した場合、それは
window.location.reload(true);
を呼び出すことができます。
ブラウザがクライアントキャッシュを破棄するよう強制する
を実行し、SPA を再読み込みします。または、より良い方法は、新しいバージョンがロードされることをエンドユーザーに通知し、作業を保存してから再ロードすることを望むかどうかを尋ねるなどです。あなたが何をしたいかによります。
関連
-
[解決済み] ページを再読み込みせずにURLを変更するにはどうすればよいですか?
-
[解決済み] jQueryでページを更新するにはどうすればよいですか?
-
[解決済み】AngularJSはシングルページアプリケーション(SPA)のためだけのものですか?)
-
[解決済み] jqueryでdivの要素がオーバーフローしていないかチェックする
-
[解決済み] JavaScriptで、ある文字列が別の文字列の中に出現するすべてのインデックスを見つけるにはどうすればよいですか?
-
[解決済み] React js 親コンポーネントから子コンポーネントの状態を変更する
-
[解決済み] JSXとLoadshを使用して、ある要素をn回繰り返す方法
-
[解決済み] JavaScriptで文字列を数値に変換する最速の方法は何ですか?
-
[解決済み] jQueryで入力ファイルが空かどうかをチェックする方法
-
[解決済み] JavaScriptとLuaの微妙な違い [終了しました]
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] javascriptで2つの数値を連結する方法は?
-
[解決済み] Angularjs - 現在の日付を表示する
-
[解決済み] オブジェクトの配列からReactコンポーネントをレンダリングする
-
[解決済み] JavaScriptのtoString()関数をオーバーライドして、デバッグ用に意味のある出力を提供することは可能でしょうか?
-
[解決済み] 無効になっている入力フィールドの値を送信する
-
[解決済み] Javascript / jQueryでAndroid端末を検出する。
-
[解決済み] AJAX Mailchimp サインアップフォームの統合
-
[解決済み] javascriptでオプションのパラメータを扱う
-
[解決済み] Node.jsのES6クラスをrequireで作る
-
[解決済み] JavaScript で `throw` の後に `return` をする必要がありますか?