fiord Advent Calendar 2025 14 日目の記事です。
現在、React2Shell(CVE-2025-55182) を起点として、数多くの Web サービスが攻撃の危険性に晒されている状態です。
その中で、なんでこの脆弱性埋め込んじゃったんだろう？と調べることは、セキュリティエンジニア、あるいは変態（労力がかかり、同様のことをするなら他の人の調査結果を見るだけで良いと思うため、敬意を表して）エンジニアにとって「セキュアなプロダクトを作る、脆弱なコードを書かない」という観点で重要になってきます。
私も現在、その詳細について調査を行っているところなのですが、その過程で Next.js 内部の挙動を見る必要があります。
これはソースコードを読む！でもよいのですが、折角 PoC があるので、手元で動かして、実際にヤバイシーンを目の当たりにしたいです。
...ということで、デバッガーを使って、なるべく詳細な挙動が追えるようにしましょう。
利用した Next.js の環境
-
npx create-next-app@latestを実行して、サンプルプロジェクトを作成 -
package.jsonのnext/react/react-domのバージョンを修正（CVE-2025-55182 の再現目的。今回は深堀しません）
完成！（というか、これだけで脆弱性の再現環境が整うのがヤバイ）
通常の Next.js のデバッグ
通常の Web 開発において、Next.js を利用する際は VSCode などのデバッグ機能を用いて、アプリケーションのコードに対して breakpoint を仕込みます。
通常であればこれでよいのですが、今回の breakpoint を差し込む対象は Next.js。node_modules 配下に生息しているファイル群の中から適切なファイルを見つけ出す必要があります。
VSCode にて Next.js 上の処理で止める
下記の設定をして、デバッガーを下記のように設定します。
- 実行コマンドに
--inspectを含める。自分はpackage.jsonを変えてnpm run devに含めてます。 - Caught Exceptions/Uncaught Exceptions にチェックマークを入れる
試してみると、最初は関係のないエラー（マップファイルが無いよ系のエラー）があるので、F5 キーを押してスキップしていたのですが、アレ？となる画面が。
これ、RCE で自分が指定したスクリプトですね。このエラーが出る際にちょうどコマンド実行されちゃっているみたいです。
自分が知りたいのは「どのように攻撃が成立したか」「どのようなコードで攻撃が成立したか」です。そのためには、この前の段階に遡る必要があります。CALL STACK がちょうどよい仕事をしそうです。
眺めていると、handleAction とか怪しいのではないでしょうか？今回は、そこの特定の箇所に breakpoint を置いて、そこから詳細な挙動が追えれば OK としましょう。
VSCode で Next.js の詳細なコードを確認する
ということで、先ほどの CALL STACK から、handleAction をクリックすれば該当箇所のコードが見れるはずです。
あっ...（詰み）
開発者モードとはいえ、Next.js のコードが一切最適化されていない訳がありませんでした。一応 Turbopack を source map でマッピングすれば読めるようになるのでしょうけど、ごめんなさい自分が方法を把握してないです...
ということで、Chrome を用いた方法に切り替えていきます。
Chrome DevTools を使う
別の方法として、Chrome の開発者モードを利用する/したことのある方も多いのではないでしょうか。こちらからもやってみましょう。
手順としては下記の通りです。
- chrome://inspect/#devices へ訪れ、「Discover network targets」に
localhost:9229とlocalhost:9230の両方が指定されていることを確認する（多分追加が必要です） - Open dedicated DevTools for Node をクリック
- Next.js サーバーを立ち上げる。この際、
--inspectオプションは必要です。 - エラーがあればコンソールに出ますし、VSCode と同様に自由に breakpoint も貼れます。
こんな感じでエラーが出たので、元のソースコードを見るために app-page-turbo.runtime.dev.js をクリックしてみましょう。VSCode 同様読めない気が....
アレ、読めるじゃん！Turbopack 周りをなんとかしてくれたようです。
ということで、ソースコードに近い形でデバッグが出来るようになりました。
厳密にはソースコードとのリンクが不完全で、今画面で表示されている箇所は多分この箇所です。
https://github.com/facebook/react/blob/ae74234eae6ebd62f19190731278e20bc1c37d51/packages/react-server/src/ReactFlightReplyServer.js#L1059
ソースコードを見ながら、デバッグを進めるのが良いのではないでしょうか？
まとめ
sourcemap 問題を適切に片付ければどのデバッガーでも正常に動くと思います。
結構気軽に試せてしまう（その程度には重要な問題でもある）ので、もし時間があれば試してみてください。