ばすにっきTipsプログラミングのTipsを紹介しています。2022.03.02あなたはAPI通信におけるCSRFトークンの仕組みを正しく説明できますか?最近はSPA(シングルページアプリケーション)など、APIを利用する機会が増えています。当記事では、APIとの通信におけるCSRFトークン(X-CSRF-TOKEN)の役割について解説します。Forgery)トークンとは、正規のページからアクセスが行われていることを証明するための値のことです。「合言葉」のようなもので、CSRFトークンが必要となるバックエンドと通信する際は、必ずCSRFトークンを事前に取得しておき、バックエンドへアクセスするときはCSRFトークンも一緒に渡す必要があります。フロントエンドは事前にCSRFトークンをバックエンドから受け取っておきます。フロントエンドから通信するときは、事前に受け取っておいたCSRFも一緒に送信します。することで不正なクライアントからのアクセスを除外できます。SPA・APIにおいては、多くの場合、X-CSRF-TOKENという値がクッキーがセットされ、サーバーへ送信する際に一緒に送られるようになっています。CSRFトークンが渡されていない、または正しくないときはサーバー側でアクセスを拒否することで、不正なクライアントからのアクセスを防ぐことができます。これに対しある疑問が投げかけられました。スポンサーリンク「でもこれだけだと、不正なフロントエンドからもアクセスできちゃうんじゃないですか?偽物のフロントエンドにもトークンを要求する実装をしておけば、バックエンドへアクセスできるようになっちゃうんじゃないですか?」と。あれれ?たしかに(・∀・;)・・・いやいや、違いますよ!スポンサーリンクバックエンドに正規のフロントエンドの情報が設定されているのが肝ここで重要なのは、CSRFトークンは正規のフロントエンドかどうかをチェックしてから返されるという点です。誰ふり構わずCSRFトークンを返していては、質問のとおり、まったく意味がありません。偽物フロントエンドからのトークン要求にも答えてしまっては、不正なフロントエンドからもバックエンドへアクセスできてしまいます。これではトークンの意味がないですよね。バックエンドはCSRFトークンを要求されると、正規のフロントエンドから要求されているかを確認するようにしています。「2チェック!」がポイント!バックエンドにはあらかじめCSRFトークンの発行を許可するドメインやオリジンなどを設定しておき、正式なフロントエンドからの通信かどうかを確認できるようにしておきます。トークンを要求されたら、Originなどのヘッダー情報が事前に設定してあるものと一致するか照合し、問題なければCSRFトークンを発行するしくみとなっているのです。スポンサーリンクもちろん、照合に失敗すれば、不正なクライアントと判定され、トークンは発行されないようになっています。することで、正規のフロントエンドと不正なクライアントを識別することができるようになっているのです。トークンのやり取りばかりに注目していると、なぜ偽のフロントエンドを識別できるかがわからなくなってしまいます。トークンを生成するか否かを判断し、正式なアクセスのときだけトークンを返すという仕組みが肝なのです。まとめフォームに埋め込むタイプのCSRFならともかく、SPAやAPI通信におけるCSRFのしくみは、少しわかりにくいものとなっています。クライアント側から明示的に要求された際に正規のクライアントかどうかを判定するところがポイントです。ここが分かれば、CSRFの意義がすんなりと理解できると思います。お買い物はこちらからAmazonでのお買い物は▼こちらのリンク▼からがおすすめです♪Amazonでお買いものする!上記リンクからAmazonギフト券をチャージしてお買い物すると、最大2.5%のポイント還元が受けられます。Combineワードもエクセルもパワーポイントも一気にPDF変換!詳細はこちらスポンサーリンク関連記事HTMLマークダウンエディタ(SimpleMDE)の使い方マークダウンエディタ”SimpleMDE”をご紹介します。HTML【BootStrap5】トースト(Toast)の使い方をまとめてみた!動かないときの注意点も紹介!通知を表示するのに便利なBootStrap5のトースト(Toast)の使い方とサンプルを紹介します。HTML【Boostrap】Vue.jsからBootstrapのトーストを呼び出すには?Vue.jsとBootstrapを組み合わせて、BootstrapのトーストをVue.jsから使えるようにする方法を紹介します。コメントをキャンセルメールアドレスが公開されることはありません。*サイト次回のコメントで使用するためブラウザーに自分の名前、メールアドレス、サイトを保存する。ホームHTMLスポンサーリンクスポンサーリンクおすすめ【VPNって意味あるの?】フリーWi-Fiを盗聴して、VPNの効果を検証してみた!「VPNってホントに意味あるの?」安全にインターネットを使う上で欠かせないサービスがVPNです。今回はVPNの仕組み・安全と言われる理由を解説し、実際にフリーWi-Fiを盗聴してVPNの効果を検証してみました。効果はあるのか?IoTや産業分野でも大注目のラズベリーパイで使えるVPNについても紹介していきます。takabus.com2022.12.21今週のトップ10【楽天銀行】キャッシュカードが無くても入金できる?2022.09.272023.01.18【楽天カード】マイナポイントの付与はいつ?利用額が少ない方は要注意。ばすにっきTips.メニューレッツノートサーバーLaravelホーム検索トップサイドバースポンサーリンクスポンサーリンクおすすめ【VPNって意味あるの?】フリーWi-Fiを盗聴して、VPNの効果を検証してみた!「VPNってホントに意味あるの?」安全にインターネットを使う上で欠かせないサービスがVPNです。今回はVPNの仕組み・安全と言われる理由を解説し、実際にフリーWi-Fiを盗聴してVPNの効果を検証してみました。効果はあるのか?IoTや産業分野でも大注目のラズベリーパイで使えるVPNについても紹介していきます。takabus.com2022.12.21今週のトップ10【楽天銀行】キャッシュカードが無くても入金できる?2022.09.272023.01.18【楽天カード】マイナポイントの付与はいつ?利用額が少ない方は要注意。楽天銀行もろもろ未分類タイトルとURLをコピーしました。