HTMXのhx-push-urlを使用している場合に、ブラウザの戻るボタンでページをリロードする方法

2025/10/22(Wed) 05:47 Higtyのシステムの作り方

hx-push-urlは少し複雑なページを作っているとうまく動かないことが多いです。割り切ってページをHTTPのGETで取得しなおした方が設計がシンプルになるときがあります。その設定方法のメモです。

レスポンスヘッダーを設定します。

context.Response.Headers.Vary = "HX-Request";
if (context.Request.HX_Request())
{
    context.Response.Headers.CacheControl = "no-store";
}

Headタグに以下を追加します。

<meta name="htmx-config" content='{"historyCacheSize": 0, "refreshOnHistoryMiss": true}'>

これで戻るボタンで毎回サーバーにリクエストを送ってページ全体を更新することができるようになります。