フロントエンド開発者のための「厄払い」

2026/01/23 開催「React Tokyo ミートアップ #13」での発表資料です。

https://react-tokyo.connpass.com/event/378753/

Transcript

1. © 2019-2026 OPTiM Corp. All rights reserved. フロントエンド開発者のための「厄払い」 React Tokyo ミートアップ #13 メイントーク 最終更新日：2025/01/23
2. © 2019-2026 OPTiM Corp. All rights reserved. 2 あけましておめでとうございます！！！！！ 今年もよろしくお願いします！！
3. © 2019-2026 OPTiM Corp. All rights reserved. 3 2025年は厄が多かったですね 残念ながら今年も、、
4. © 2019-2026 OPTiM Corp. All rights reserved. 4 厄を振り返ってみましょう
5. © 2019-2026 OPTiM Corp. All rights reserved. 5 自己紹介 フロントエンド リードエンジニア Riml / 高橋 株式会社オプティム @Fande4d  やってること ◼ Webフロントエンド全般 ⚫ デザインシステム立ち上げ(0→1、1→10) ⚫ アーキテクト・開発 ◼ マネジメント ◼ 横断組織立ち上げ  趣味 ◼ 技術探索(ネットサーフィン/技術イベント参加、登壇) ◼ LLMで遊ぶ ◼ VTuber・アニメ ◼ ドライブ ◼ QOL上げる系のもの収集
6. © 2019-2026 OPTiM Corp. All rights reserved. 6 アジェンダ  フロントエンド開発者の苦しんだ厄 振り返り ◼ npm サプライチェーン攻撃 Shai-Hulud ◼ pnpm 脆弱性について ◼ Node.js 脆弱性について  厄払い ~厄除け・お守り~ 年明けなので振り返りを共有したかった ぜひ懇親会やSNSで良い案があれば教えてください みなさんは年末・年始で振り返りをしましたか？ 振り返った話など色々聞きたいのでぜひ話しましょう！ ◼ React 脆弱性について ◼ ReactRouter 脆弱性について ◼ Hono 脆弱性について
7. © 2019-2026 OPTiM Corp. All rights reserved. 7 脆弱性・攻撃関連 フロントエンド開発者の苦しんだ厄 振り返り
8. © 2019-2026 OPTiM Corp. All rights reserved. 8 脆弱性・攻撃関連 npm サプライチェーン攻撃 Shai-Hulud  What ◼ 2025年11月末に発生した大規模なnpmサプライチェーン攻撃。数百のnpmパッケージが侵害され、 インストール時スクリプト（preinstall / postinstall / prepare）に悪意のあるコードが挿入された  Why ◼ preinstallフェーズで実行されるため、テストやセキュリティチェック前に悪意のあるコードが実行される。Zapier、PostHog、 Postmanなどの有名プロジェクトのメンテナーアカウントが侵害された 改竄パッケージ インストール .npmrc / env から トークン収集 "aaa": "^1.57.0", "bbb": "latest", "ccc": "~2" preinstall マルウェア実行 他パッケージ 改竄 マルウェア実行 GitHub / クラウド 鍵窃取 悪いこと パッケージ 更新 感染！！
9. © 2019-2026 OPTiM Corp. All rights reserved. 9 脆弱性・攻撃関連 React 脆弱性 ℹ どういう脆弱性があったか React Flight プロトコルのデシリアライゼーション処理に欠陥があ りました。 hasOwnProperty()チェックをバイパスしてFunctionコンストラク タへアクセス可能。 攻撃者は単一のHTTP POSTリクエストで認証前に任意のNode.js コードを実行できる。 どういう場合に影響を受けるか ◼ React Server Componentsを使用しているアプリケーション ◼ React 19.0.0、19.1.0-19.1.1、19.2.0を使用している場合 ◼ Next.js 14.2.0-14.2.34、15.0.0-15.0.6、15.1.0-15.1.10 を使用している場合 ◼ React Router、Expo、Redwood SDK、WakuでRSCを使用 なぜその脆弱性が発生したか Server Function エンドポイントに送信されるペイロード(React Flight プロトコル)のデシリアライゼーション処理に重大な欠陥が あり、 JavaScriptのプロトタイプチェーンを経由してFunctionコン ストラクタへアクセス可能になっているのが発見された。 実際に中国関連APT、暗号通貨マイニング、Cobalt Strike、バック ドアなどの攻撃キャンペーンや悪用が観測されている。 ✅どのバージョンで解決されているか ◼ React 19.0.1、19.1.2、19.2.1 ◼ Next.js 14.2.35、15.0.7、15.1.11以降 ◼ React Router、Expo、Redwood SDK、Wakuの 最新版 2025年12月3日に公開 CVSS 10.0 CVE-2025-55182 (Critical) CVE-2025-67779 (Critical)
10. © 2019-2026 OPTiM Corp. All rights reserved. 10 脆弱性・攻撃関連 React 脆弱性  追加で発見された脆弱性 ◼CVE-2025-55184 (High): Denial of Service（CVSS 7.5） ◼CVE-2025-55183 (Medium): ソースコード露出（CVSS 5.3）  参照リンク ◼React公式: https://react.dev/blog/2025/12/03/critical-security-vulnerability-in-react-server-components ◼CVE-2025-55182: https://nvd.nist.gov/vuln/detail/CVE-2025-55182 ◼CVE-2025-55184: https://nvd.nist.gov/vuln/detail/CVE-2025-55184 ◼CVE-2025-55183: https://nvd.nist.gov/vuln/detail/CVE-2025-55183 ◼CVE-2025-67779: https://nvd.nist.gov/vuln/detail/CVE-2025-67779
11. © 2019-2026 OPTiM Corp. All rights reserved. 11 脆弱性・攻撃関連 pnpm 脆弱性 ℹ どういう脆弱性があったか Git依存関係のインストール時、リモートコード実行が可能になる欠陥。 攻撃者が悪意のあるGitリポジトリURLをpackage.jsonに含めることで、 pnpm installまたはpnpm update実行時に任意のコマンドを実行でき る どういう場合に影響を受けるか ◼ pnpm 10.0.0から10.25.0を使用している場合 ◼ package.jsonにGit依存関係（git+https://形式）を含む プロジェクト なぜその脆弱性が発生したか Gitリポジトリのクローン処理において、URLの検証が不十分なため、 攻撃者がシェルインジェクションを実行可能になっていた。 CI/CDパイプラインで自動的にpnpm installが実行される環境では、 攻撃者がPRやコミットに悪意のあるGit依存関係を含めるだけで、ビ ルドサーバー上で任意のコードを実行できる。 認証情報の窃取、ソースコードの改ざん、バックドアの設置などが可 能になってしまっていた。 ✅どのバージョンで解決されているか ◼ pnpm 10.26.0または10.27.0以降 2026年1月7日に公開 CVSS 9.8 (NIST) / 8.8 (CNA) CVE-2025-69264 (Critical)
12. © 2019-2026 OPTiM Corp. All rights reserved. 12 脆弱性・攻撃関連 pnpm 脆弱性  追加で発見された脆弱性 ◼CVE-2025-69262 (High): コマンドインジェクション (CVSS 7.5) ◼CVE-2025-69263 (High): ロックファイルの整合性バイパスによるリモート動的依存関係の許可（CVSS 7.5)  参照リンク ◼pnpm公式: https://github.com/pnpm/pnpm/security ◼CVE-2025-69264: https://nvd.nist.gov/vuln/detail/CVE-2025-69264 ◼CVE-2025-69262: https://advisories.gitlab.com/pkg/npm/pnpm/CVE-2025-69262 ◼CVE-2025-69263: https://nvd.nist.gov/vuln/detail/CVE-2025-69263 ◼GitLab Advisory: https://gitlab.com/gitlab-org/advisories-community
13. © 2019-2026 OPTiM Corp. All rights reserved. 13 脆弱性・攻撃関連 React Router脆弱性 ℹ どういう脆弱性があったか createFileSessionStorage()で署名なしクッキー使用 時、../../../etc/passwdのようなディレクトリトラバーサルで セッションディレクトリ外のファイルへ読み取り・書き込みが可能、 設定ファイルやソースコードが露出する loaderやactionからの信頼できないコンテンツによるリダイレクト が安全でないURLを生成し、XSSが可能 script:ld+jsonタグ生成時にSSRで任意のJavaScript実行など どういう場合に影響を受けるか ◼ @react-router/node 7.0.0-7.9.3でcreateFileSessionStorage() を署名なしクッキー利用の場合 ◼ Framework Mode、Data Mode、またはRSCモードでSPAナビ ゲーションを使用している場合 ◼ Framework Modeでmeta()と<Meta> APIを使用している場合 ◼ Document POSTリクエストを使用している場合 ◼ 攻撃者制御のパスをMap()、<Link>、redirect()に渡している場合 なぜその脆弱性が発生したか ファイルパスの検証とサニタイゼーション処理が不十分。署名なしクッ キー使用時、ディレクトリトラバーサル攻撃を防ぐパス正規化が欠如 リダイレクトURLの検証が不十分。loader/actionから返されるURLに 対する信頼境界の設定とサニタイゼーションが欠如。 SSR時のJSONデータのエスケープ処理が不適切。script:ld+jsonタグ への動的コンテンツ挿入時の安全な文字列化が実装されていなかった。 など・・・ ✅どのバージョンで解決されているか ◼ React Router 7.9.4以降 ◼ @remix-run/node 2.17.2以降 ◼ @remix-run/deno 2.17.2以降 2026年1月8日に公開 CVSS 9.1 CVE-2025-61686 (Critical) CVE-2026-22029 (High) CVE-2025-59057 (High) CVE-2026-22030 (Medium) CVE-2025-68470 (Medium)
14. © 2019-2026 OPTiM Corp. All rights reserved. 14 脆弱性・攻撃関連 React Router脆弱性  参照リンク ◼React Router公式: https://github.com/remix-run/react-router/security/advisories ◼Remix公式: https://github.com/remix-run/remix/security/advisories ◼CVE-2025-61686: https://nvd.nist.gov/vuln/detail/CVE-2025-61686 ◼CCB Belgium: https://ccb.belgium.be/advisories/warning-high-severity-vulnerabilities-react-router-patch- immediately
15. © 2019-2026 OPTiM Corp. All rights reserved. 15 脆弱性・攻撃関連 Node.js 脆弱性 ℹ どういう脆弱性があったか Buffer.allocのメモリ露出、ファイルシステムのパーミッ ションバイパス、HTTP/2サーバークラッシュの3つの脆弱 性が含まれ、 async_hooksでのDoSではReact/Next.jsア プリケーションへの影響がある 2025年12月15日に前出しで脆弱性予告されていたが、リリースが 2026年1月7日に延期され、さらに2026年1月13日に延期された どういう場合に影響を受けるか ◼ Node.js 20.x、22.x、24.x、25.xの特定バージョンを使用して いる場合 ◼ vmモジュールのタイムアウト機能を使用している場合 ◼ --allow-fs-read/writeのパーミッションモデルを使用している 場合 ◼ HTTP/2サーバーを運用している場合 ◼ AsyncLocalStorageを使用するReact/Next.jsアプリケーション なぜその脆弱性が発生したか vmモジュールのタイムアウト機能使用時、割り込まれたバッファ割り当てが初期 化されず、プロセス内機密情報が漏洩する 細工された相対シンボリックリンクパスにより、許可されたディレクトリ外の機密 ファイルへアクセス可能 不正なHTTP/2 HEADERSフレームによりクラッシュし、リモートDoSが可能 async_hooks有効時、深い再帰による「Maximum call stack size exceeded」エ ラーがuncaughtExceptionハンドラーに到達せずプロセスが終了 ✅どのバージョンで解決されているか ◼ Node.js 20.20.0、22.22.0、24.13.0、25.3.0以降 2025年12月3日に公開 CVSS 8.1 CVE-2025-55131 (High) CVE-2025-55130 (High) CVE-2025-59465 (High) CVE-2025-59466 (Medium)
16. © 2019-2026 OPTiM Corp. All rights reserved. 16 脆弱性・攻撃関連 Node.js 脆弱性  追加で発見された脆弱性 ◼ CVE-2025-59464 (Medium): TLS証明書処理のメモリリーク(CVSS 5.3) ◼ CVE-2026-21636 (Medium): Unix Domain Socketのバイパス ◼ CVE-2026-21637 (Medium): TLS PSK/ALPNコールバックのDoS ◼ CVE-2025-55132 (Low): fs.futimes()の読み取り専用バイパス  参照リンク ◼ Node.js公式: https://nodejs.org/en/blog/vulnerability/december-2025-security-releases ◼ async_hooks DoS: https://nodejs.org/ja/blog/vulnerability/january-2026-dos-mitigation-async-hooks ◼ CVE-2025-55131: https://nvd.nist.gov/vuln/detail/CVE-2025-55131 ◼ CVE-2025-55130: https://nvd.nist.gov/vuln/detail/CVE-2025-55130 ◼ CVE-2025-59465: https://nvd.nist.gov/vuln/detail/CVE-2025-59465 ◼ CVE-2025-59466: https://nvd.nist.gov/vuln/detail/CVE-2025-59466 ◼ CVE-2025-59464: https://nvd.nist.gov/vuln/detail/CVE-2025-59464 ◼ CVE-2026-21636: https://nvd.nist.gov/vuln/detail/CVE-2026-21636 ◼ CVE-2026-21637: https://nvd.nist.gov/vuln/detail/CVE-2026-21637 ◼ CVE-2025-55132: https://nvd.nist.gov/vuln/detail/CVE-2025-55132
17. © 2019-2026 OPTiM Corp. All rights reserved. 17 脆弱性・攻撃関連 Hono 脆弱性 ℹ どういう脆弱性があったか JWK（JSON Web Key）のalgフィールド検証が不十分で、攻撃者が 異なるアルゴリズムを使用して署名を偽造できる アルゴリズム混同攻撃により、本来非対称鍵（RS256）で署名され るべきトークンを対称鍵（HS256）で偽造可能 また、デフォルトアルゴリズムの検証が不十分で、「none」アルゴ リズムを使用して署名なしのトークンが受け入れられる可能性があ る どういう場合に影響を受けるか ◼ Hono 4.11.3以前でJWTミドルウェア（@hono/jwt）を使用 している場合 ◼ JWK（JSON Web Key）ベースの認証を実装している場合 ◼ 非対称鍵アルゴリズム（RS256、ES256など）を使用してい る場合 ◼ JWT検証時にアルゴリズムを明示的に指定していない実装 なぜその脆弱性が発生したか CVE-2026-22818: JWKのalgフィールドとJWTヘッダーのalg フィールドが一致しているかの検証が欠如していた。 JWT検証時にアルゴリズムの厳密な検証が行われず、攻撃者が「alg: none」を指定することで署名検証をバイパスできる状態だった。 非対称鍵アルゴリズムを対称鍵アルゴリズムに切り替えることで、公 開鍵をHMACの秘密鍵として使用し偽造トークンを生成できる状態 だった。 ✅どのバージョンで解決されているか ◼ Hono 4.11.4以降へアップグレード ◼ JWTミドルウェア設定でアルゴリズムを明示的に指定する 2026年1月13日に公開 CVSS 8.2 CVE-2026-22818 (High) CVE-2026-22817 (High)
18. © 2019-2026 OPTiM Corp. All rights reserved. 18 脆弱性・攻撃関連 Hono 脆弱性  参照リンク ◼Hono公式: https://github.com/honojs/hono/security ◼GHSA-3vhc-576x-3qv4: https://github.com/honojs/hono/security/advisories/GHSA-3vhc-576x-3qv4 ◼GHSA-f67f-6cw9-8mq4: https://github.com/honojs/hono/security/advisories/GHSA-f67f-6cw9-8mq4 ◼CVE-2026-22818: https://nvd.nist.gov/vuln/detail/CVE-2026-22818 ◼CVE-2026-22817: https://nvd.nist.gov/vuln/detail/CVE-2026-22817
19. © 2019-2026 OPTiM Corp. All rights reserved. 19 厄除け・お守り案
20. © 2019-2026 OPTiM Corp. All rights reserved. 20 厄除け・お守り 1つの壁が突破されても、次のレイヤーが攻撃を阻止します 「Shift Left（開発の早期段階での対策）」 ✓ コーディング時、レビュー時、ビルド時に脆弱性を検出・修正 することで、本番環境への影響を最小化 「Runtime Protection（実行時の保護）」 ✓ CSP、CORS、セキュリティヘッダー、WAF、ランタイム監視により、 開発段階で見逃した脆弱性やゼロデイ攻撃から保護する最後の防衛線 の両立が求められます。 多層防御 (Defense in Depth)という考え方 単一のセキュリティ対策に頼るのではなく 複数の独立した防御レイヤーを重ねる設計思想 コーディング/Linter/レビュー/ビルド CI時: SCA (構成解析) と SAST (静的解析) 実行時: DAST (動的解析) と WAF、ランタイム監視 Runtime Protection Shift Left
21. © 2019-2026 OPTiM Corp. All rights reserved. 21  レイヤー1: 開発環境・依存関係 ◼ pnpm/npm/yarn audit: 依存関係の定期的な監査 ◼ Lock fileによる依存関係の固定 ◼ Linterによるセキュリティルールの追加 ◼ Renovate: 依存関係の自動更新とPR作成、セキュリティパッチの適用 ◼ Dependabot: GitHub統合の依存関係監視  レイヤー2: ビルド・CI/CD ◼ SBOM(ソフトウェア部品表)スキャンと脆弱性検出 ◼ Secret管理の徹底（Secrets Manager、Key Vaultなど） ◼ CI/CDパイプラインでのセキュリティチェック ⚫ OSV Scanner: Google提供のOSSセキュリティスキャナー ⚫ Trivy: コンテナ・依存関係・IaCの総合脆弱性スキャナー ⚫ SAST (Static Application Security Testing): ソースコードの静的解析 ⚫ Snyk: 依存関係とコンテナのセキュリティスキャン 厄除け・お守り Runtime Protection Shift Left
22. © 2019-2026 OPTiM Corp. All rights reserved. 22  レイヤー3: ランタイム・デプロイ ◼ 各ライブラリの最新パッチの適用 ◼ CSP、CORS、セキュリティヘッダーの設定 ◼ 最小権限の原則に基づくアクセス制御 ◼ コンテナ・サーバーレス環境の適切な設定 ◼ DAST (Dynamic Application Security Testing): 実行時の動的脆弱性検查 ⚫ OWASP ZAPなど ◼ WAF: Cloudflare WAF, AWS WAF , Vercel WAF  レイヤー4:監視・インシデント対応 ◼ リアルタイム脅威監視とログ分析 ◼ 定期的なセキュリティレビュー/キャッチアップ ⚫ GitHub Security Advisories: 脆弱性情報の追跡 ⚫ JVN(脆弱性対策情報データベース)、IPA ◼ Sentry: エラー監視とパフォーマンス追跡 ◼ Datadog / New Relic: APMとセキュリティ監視 厄除け・お守り Runtime Protection Shift Left
23. © 2019-2026 OPTiM Corp. All rights reserved. 23 フロントエンドからインフラまで共通認識を持つことが最大の防御ですが、、 全部をやるのは大変、、、
24. © 2019-2026 OPTiM Corp. All rights reserved. 24 厄除け・お守り フロントエンドエンジニアが少しずつ始める多層防御  ステップ1 ◼Lockfileのバージョンを固定していく、package.jsonの変更時は必ずpnpm/npm/yarn audit fixを実行 ◼pnpm/npm/yarn audit を CI/CDに追加：既存のワークフローに1行追加するだけ ◼フロントエンドエンジニアは得意であろう情報キャッチアップに脆弱性関連も追加しチーム内で共有する  ステップ2 ◼環境変数をsecrets manager経由に変更する ◼Dependabot / Renovateを有効化：設定ファイル1つでPR自動作成 (設定はしっかり確認大事) ◼セキュリティヘッダーを設定（CSP, X-Frame-Options等）  ステップ3 ◼Sentryなどを導入し監視体制を作る ◼Trivyを毎週自動実行し、結果をSlackへ通知するなどCIを拡充 ◼チームのそれぞれの得意な領域の人に手伝ってもらう
25. © 2019-2026 OPTiM Corp. All rights reserved. 25 厄除け・お守り 厄払いまではいきませんでした。。。 もちろん多層防御をしたからといって全てが防げるわけではありません。 ですが、こういった防御策を取ることでリスクを減らすことはできます。 直近はReact2Shellなどが話題になっていますが、 LLMの発展も含め、ReactやNext.jsのようなフロントエンド関連のみならず今まで見つかってなかった脆弱性や攻撃な どどんどん増えていくと思っています。 今年はおみくじで吉でしたが頑張っていく所存です。 ぜひ一緒に2026年も乗り越えていきましょう！ ご清聴ありがとうございました。
26. © 2019-2026 OPTiM Corp. All rights reserved.