前提

rails6.1.4

javascriptでコメント編集機能を実装中($.ajaxでフロントから直接railsサーバーへポストしようとしてる)

view

div id="js-textarea-comment-box-#{comment.id}" style='display: none;'
    textarea id="js-textarea-comment-#{comment.id}"
    button.btn.js-button-edit-comment-cancel data-comment-id="#{comment.id}" キャンセル
    button.btn.js-button-comment-update data-comment-id="#{comment.id}" 更新

Javascript

$.ajax({
                type: 'PATCH',
                url: '/comments/' + commentId,
                data: {
                    comment: {
                        body: body
                    }
                }
            }).done(function (result) {
                resolve(result)
            }).fail(function (result) {
                reject(result)
            });

form_withを使わずにtextareaの情報をJavascripで取得して$.ajaxでPOST使用とするとviewが更新されず、サーバーのログに下記エラーが出ました

Started PATCH "/comments/18" for 2001:f77:9e0:800:8cec:484a:9b0c:9561 at 2022-06-10 05:18:37 +0900
Cannot render console from 2001:f77:9e0:800:8cec:484a:9b0c:9561! Allowed networks: 127.0.0.0/127.255.255.255, ::1
Processing by CommentsController#update as */*
  Parameters: {"comment"=>{"body"=>"うにご飯"}, "id"=>"18"}
Can't verify CSRF token authenticity.
Completed 422 Unprocessable Entity in 1ms (ActiveRecord: 0.0ms | Allocations: 969)

  
ActionController::InvalidAuthenticityToken (ActionController::InvalidAuthenticityToken):
  
actionpack (6.1.4.1) lib/action_controller/metal/request_forgery_protection.rb:211:in `handle_unverified_request'
actionpack (6.1.4.1) lib/action_controller/metal/request_forgery_protection.rb:243:in `handle_unverified_request'

Can't verify CSRF token authenticity.←ここっぽいなと思って

DeepLで翻訳してもらうと「CSRFトークンの真正性を確認できません。」とのこと。

CSRFってなんだったっけってなったので復習

CSRFとは?

クロスサイトリクエストフォージェリ（CSRF）は、Webアプリケーションに存在する脆弱性、もしくはその脆弱性を利用した攻撃方法のことで、掲示板や問い合わせフォームなどを処理するWebアプリケーションが、本来拒否すべき他サイトからのリクエストを受信し処理してしまう。

この攻撃方法で、攻撃用Webページを準備し、ユーザがアクセスさせたり、ユーザが攻撃用Webページにアクセスすると、攻撃用Webページ内にあらかじめ用意されていた不正なリクエストが攻撃対象サーバに送られる。

サイトのリンクをふむと関係のない他サイトへ不正なリクエストを送るなどして悪用されるような攻撃のことでrailsではcsrf対策がデフォルトで設定してある。