116. hx-history（インスタンスごとの履歴制御：履歴保存の「許可」と「禁止」）

原理：すべてを記録すべきか、否か

履歴に残したくないページもある

HTMXの標準設定では、hx-push-url を使った遷移は自動的にブラウザにキャッシュされ、履歴として保存されます。これは基本的には便利な機能ですが、プライバシーやセキュリティの観点から「このページだけは履歴に保存してほしくない（戻るボタンで戻ってきてほしくない）」という場面があります。 - パスワード入力画面。 - 個人情報の表示画面。 - 一時的なエラーメッセージの表示。

「hx-history（エイチエックス・ヒストリー）」属性を使うと、特定の要素に対して履歴保存の振る舞いを細かくコントロールすることができます。

実践：履歴の「保存ルール」を上書きする

1. 履歴への保存を明示的に禁止する

ある要素、またはその子要素での操作を履歴に残したくない場合に指定します。

<!-- 
  hx-history="false" : 
  この div の中にある HTMX 操作は、URL が変わっても履歴として保存（キャッシュ）されません。
-->
<div hx-history="false">
    <button hx-get="/private-data" hx-push-url="true">
        秘密のデータを表示（履歴には残りません）
    </button>
</div>

2. ルールの継承

hx-history は、他のHTMX属性と同じように、親要素に書けばその中の子要素すべてに影響を与えます。ページ全体を履歴に残したくない場合は、<body> タグに書くことも可能です。

3. ステップ・バイ・ステップ解説

「残したくない」場所の特定: ログイン後、あるいは機密情報を扱うエリアを探します。
属性の付与: hx-history="false" と書き込みます。
注意点: これを指定しても、ブラウザの「URLバー」は変わる可能性があります。あくまで「ブラウザ内に画面のHTMLを保存して、次に戻ったときに自動復元するかどうか」を制御するものです。

比較：通常の履歴保存 vs hx-history="false"

通常の履歴保存

体験: 「戻る」ボタンを押した瞬間、前の画面が（サーバーに聞かずに）パッと一瞬で戻ってくる。
欠点: 誰かがPCを操作したとき、戻るボタンで秘密の画面が見えてしまうリスクがある。

hx-history="false"

体験: 「戻る」ボタンを押すと、HTMXはキャッシュを使わず、改めてサーバーに最新の情報をリクエストしに行く。
利点: 常に最新の状態が表示され、不要な古いデータがブラウザに残り続けない。

まとめ：初心者のための「忘れさせる」技術

履歴を管理することは、ユーザーの「足跡」を管理することです。

セキュリティの第一歩: 銀行やECサイトのマイページなど、他の人に見られたくない場所では false を検討しましょう。
キャッシュの節約: 非常に大きなHTMLをやり取りする際、すべてを履歴に保存し続けるとブラウザのメモリを圧迫することがあります。重要でない中間的な画面は履歴から外すのも一つの手です。
「戻る」を壊さない: 履歴保存を禁止しても、戻るボタンそのものが動かなくなるわけではありません。ただ「戻り方がより確実（再リクエスト）になる」だけなので、安心して使いましょう。

記録すること。忘れさせること。hx-history というスイッチを使いこなして、便利さと安全性が高い次元で両動した、プロフェッショナルなWebアプリを実現してください。次の記事では、履歴に保存する「範囲」を指定する「hx-history-elt（117. hx-history-elt）」をご紹介します。