Как я могу проверить токен подлинности при отправке формы через ajax success?

Question

У меня есть условие, при котором сначала запускается запрос ajax для получения соответствующего URL хоста.Если возвращенное условие верно, я хочу отправить форму рельсов.Форма отправлена ​​правильно, но я получаю сообщение об ошибке: не удается проверить токен подлинности.

$(document).ready(function() {
      var url, email;
      $("form#new_user").submit(function(e){
        e.preventDefault();
        email = document.getElementById("user_email").value;
        $.ajax("/return_host", {
          type: "GET",
          data: {
            email: email
          },
          beforeSend: function(xhr) {
            xhr.setRequestHeader('X-CSRF-Token', $('meta[name="csrf-token"]').attr('content'));
          },
          success: function(data) {
            if(data['goto'] == true){
              host = data["host"];
              url = host + "/users/sign_in";
              $("form").attr("action", url);
              $("form").trigger('submit.rails');
            } else {
              location.reload();
            }
          }
        });
      });
    });

Как я могу отправить токен подлинности при запуске формы рельсов через ajax success?

Answer 1

Если вы работаете на Rails 5.1+, я бы порекомендовал использовать помощник form_with для обработки запроса ajax [https://api.rubyonrails.org/v5.2.1/classes/ActionView/Helpers/FormHelper.html#method-i-form_with].

. Вы все равно сможете добиться успеха иобратные вызовы ошибок с использованием кода, как я поделился ниже.

`` `

let form = document.getElementById('my_form')

form.addEventListener('ajax:error', (event) => {
  let form                  = event.target
  let [errors, status, xhr] = event.detail

  // DO SOMETHING
})

form.addEventListener('ajax:success', (event) => {
  let form = event.target

  // DO SOMETHING
})

form.addEventListener('ajax:before', (event) => {
  let form = event.target

  // DO SOMETHING
})

` ``

Таким образом, rails будет обрабатывать токен аутентификации / csrf, пока выВы все еще сможете использовать Ajax - с опцией data: { remote: true }, чтобы обеспечить перезагрузку страницы.

Надеюсь, это поможет.

Answer 2

Пожалуйста, проверьте, имеет ли ваша форма скрытое поле ввода с именем authenticity_token или нет, для форм, созданных с помощью помощников рельсов, это поле включено по умолчанию.

Если нет, то это то, что вызывает ошибку как рельсыпри отправке формы ожидает параметр с именем authenticity_token.

Вы можете добавить это на лету в вашем обратном вызове успеха, как показано ниже:

     success: function(data) {
        if(data['goto'] == true){
          host = data["host"];
          url = host + "/users/sign_in";
          var form = $("form");
          var authenticityToken = document.createElement("input");
          authenticityToken.setAttribute("type", "hidden");
          authenticityToken.setAttribute("name", "authenticity_token");
          authenticityToken.setAttribute("value", $('meta[name="csrf-token"]').attr('content'));
          form.append(authenticityToken);
          form.attr("action", url);
          form.trigger('submit.rails');
        } else {
          location.reload();
        }
      }

Надеюсь, это поможет!