Webフロー設計

2025/12/23

クレジットカードの悪用がはびこった結果、日本では経済産業省が主導してセキュリティガイドラインを決済利用企業に強制する展開となった。
幅広い課題のうち、多要素認証(MFA)の要求は「堅牢なWebフローの実装」という古くて新しい問題を掘り起こした。

技術サマリー

試行錯誤のすえ、HTMLとHTTPだけで堅牢なフローを実装するためのポイントは次の技術のセットであることが分かった。
全容ではなくポイントに絞っている。

  1. 保護対象のURLに、ユーザーの状態に応じてMFAの認証フォームを表示する
  • 素朴に実装すると認証フォームが独立したURLを持つ設計になるが、これを避ける
  1. 認証フォームがキャッシュされないようHTTPレスポンスヘッダーを設定する
  • 現状はCache-Control: no-storeが重要だが、十分とは言えない
  1. バックフォワードキャッシュを抑制するコードを追加する

バックフォワードキャッシュを制御するコードは次のとおり。

window.addEventListener('pageshow', (e) => {
  if (e.persisted) {
    location.reload()
  }
})

背景

言うまでもなく認証はソフトウェアやデジタルサービスの中核機能であり、セキュリティを考慮に入れるとWebコア技術に狭く限定する実装方式が適している。

一方で、Webブラウザは1990年代の登場以来、最低限のフロー制御をサポートする機能すら一切実装したことがない。モバイルデバイスの普及に伴ってキャッシュ機能が強化されたことで、フロー制御はむしろ退化している。
簡略化のため上の説明から省略したものとして、ほかにServiceWorkerも阻害要因になりうる。

MFAは従来の認証OK/NGという2つの状態から自由度を増やし、制御の難易度を飛躍的に引き上げていく。
フローの工夫が不足すると表示されるべきでない画面が表示され、かんたんに理解できないシステムに陥る。

限界が近い

冒頭の方式は、過渡的な認証画面へのURLを避けることで認証完了後の無効なアクセスを低減するものだ。
よって単一のURLに複数の機能を多重化する方向で複雑化が進む。

追加認証手段が1通りに決まるような2FAの状況のうちは対処できるが、いずれPasskeyを追加する際に素朴な判定で吸収し切れない可能性がある。
ある方式をトライして失敗したうえ、別の方式で再トライするようなシナリオのような長いフローになってくると途中で問題が起きる確率は高まる。

HTML+HTTPによるフロー構築の限界を超えるようであれば、サポートする認証方式の組み合わせを抑制する必要が出るだろう。

他の方式には期待できない

Javascript開発の変遷でブラウザ向けUI技術の動向に触れた。
4年半が経過したところで状況は旧態依然としており、UI技術の置換は当面起きない見通しと言える。ライブラリは林立したものの、結局のところコア機能がブラウザに実装されなければ生き残らないのではないか。

JavascriptのUIライブラリはSPAなどのUI描画には使えることは分かっているのだが、認証フローに用いるとなるとセキュリティ強度の低下を許容できないような印象がある。cookieにもHttpOnlyというオプションがあるとおり、まずfetch()を使うのかHTML formのPOSTに限定するのかという選択に壁がある。
先日、Next.jsに重大なセキュリティ欠陥CVE-2025-66478が発見されたとおり、クライアントサイドのJavascriptの厚みを増していくほどアタックサーフェスも増える。

代替選択肢が確立するには、現時点では予想されていないような標準規格の追加が必要であり、極論すると永遠に白紙とも言える。
HTTPリダイレクトでフロー構築するという原始的な方式はまだまだ避けられないのではないか。

フローのレイアウト

低レイヤの遷移で問題を生じにくくする、というハードルのほかに、どのような条件で何を表示するか、というデザイン上の課題も生じる。これについては中間的な指針にとどまっている。

開発途上でモーダルダイアログの導入も検討したが、2025年現在で利用できるパーツの品質が悪いので早々に取りやめた。
検討過程で、理解を深めるため上野学『モードレスデザイン』を読み、その結論としてモードレスという概念は実務上の指針としては使えないだろうという印象を持っている。

モーダル/モードレスという2値では状況をうまく記述できない事象に見えている。おそらく、アフォーダンスの程度問題と捉えた方が具体的な指針を得やすいのではないかと考えている。

信号機のユーザーインターフェース

モードレスの主張を読んでいて、フィットしない実例として信号機のユーザーインターフェースを考えるべきだろうと今考えている。

信号機は完全にモーダルであって、モードレスの主張が妥当なのであればモードレスな信号機が実装可能であって普及すべきだということになる。

モードレスな交通制御の例として ラウンドアバウトを想定できるが、信号機の方が優れているのではないか。

安全を目的としたときにモードの理解は必要であり、それを知覚から消すという方法は危険に直結することでもあると思う。
Passkeyを統合する際に、また選択を迫られることになろう。

⁋ 2025/12/23↻ 2025/12/25