タグ

JavaScriptとNext.jsに関するmkusakaのブックマーク (2)

  • Next.jsはどのようにCSRF対策をしているのか? - プププなテクブ

    最近、Next.jsがどのようにCSRF対策をしているのかを考える機会がありました。 そんななかで色々と学んだことを今回は書きます。 CSRFとは 題に入っていく前に、いま一度CSRFについて改めて復習しておきましょう。CSRF(Cross-Site Request Forgery)とは、ユーザーが意図しないリクエストを攻撃者が勝手に送信させる攻撃です。以下に攻撃の一連の流れを可視化しています。 sequenceDiagram participant User as ユーザー participant Bank as 銀行サイト (bank.example) participant Evil as 悪意のあるサイト (evil.example) User->>Bank: ログイン(セッションCookieを取得) User->>Evil: 悪意のあるページを開く Evil->>User: 自

    Next.jsはどのようにCSRF対策をしているのか? - プププなテクブ
    mkusaka
    mkusaka 2026/02/21
    Next.jsのCSRF対策を検証した記事で、Server ActionsはPOSTのみ許可しOriginとHostを比較して検証しますが、route.tsでは手動対策が必要です。
  • なぜ "use client" ディレクティブは優れた API なのか

    革新的な API は、時としてその真価を理解されるまでに時間を要します。React Server Components そして "use client" ディレクティブもその一例でしょう。Next.js App Router とともに登場して以来、絶えず議論の的となってきたこの API について改めて、光を当ててみたいと思います。 フレームワークロックインを解消する「標準 API」 RSC における "use client" ディレクティブ API は、フレームワークロックインを生み出すどころか、むしろ解消するための革新的なアプローチです。 RSC は Next.js App Router とともに登場したために Next.js の機能の一部であるという誤解や、そのような漠然とした印象が依然として拭えないのも事実ですが、RSC の一部である "use client" を含めてこれらは Re

    なぜ "use client" ディレクティブは優れた API なのか
    mkusaka
    mkusaka 2025/11/19
    React RSCの"use client"を解説。ECMAScriptのDirective Prologuesに基づく正当性と、サーバー/クライアント境界の明確化を論じる。
  • 1