Phoenix CSRF 令牌不匹配

Question

正在尝试让 ajax 运行 Phoenix。我通过执行以下操作获得了 csrf 令牌，所以我拥有它：

<input type="hidden" id="_csrf_token"  name="_csrf_token" value="<%= get_csrf_token() %>">

然后像这样使用它：

$.ajax({
  type: "POST",
  url: "<%= lesson_path @conn, :create %>",
  beforeSend: function(xhr)
  {
    token = $('#_csrf_token').val();
    xhr.setRequestHeader('_csrf_token', token );
  },
  data: data,
  success: function(data, textStatus, jqXHR) {
    alert(textStatus);
  }
});

问题是我得到的令牌不是正确的令牌。查看 google chrome 检查员，我在请求中收到 403，表示存在无效的 csrf 令牌。有效的会话令牌总是不同于它给我的令牌。得到这样的东西 IiJndz5FeV9MMhIKMzggUTtmHUALAAAAkJ/6Yr/k4BxdiKmiaMUqsw== 它通常想要这样的东西 hHAg7V4xpjnZsM8Z+H1xw==

知道为什么我会得到一个与它想要的不同的令牌吗？

我也试过以下方法：

Plug.Conn.get_session(conn, :csrf_token)
Map.get(conn.req_cookies, "_csrf_token")

两者都不会返回任何结果。

Answer 1

The token may be sent by the request either via the params with key “_csrf_token” or a header with name “x-csrf-token”.

尝试使用以下键设置您的 header：

x-csrf-token

Answer 2

谢谢。花了我几个小时。我最终得到：

<div class="form-group">
  <form id="number" name="number" method="post">
    <meta name="csrf" content="<%= Plug.CSRFProtection.get_csrf_token() %>">
    <input id="_csrf_token" name="_csrf_token"
       type="hidden" value="<%= Plug.CSRFProtection.get_csrf_token() %>">
    <%= text_input :blocks, :num, value: "" %>
    <%= submit "Submit", id: "submit", class: "btn btn-primary" %>
  </form>
</div>

<script>
  var csrf = document.querySelector("meta[name=csrf]").content;

  $.ajax({
    url: "/posts",
    type: "post",
    data: {
      post: { title: post } })
    },
    headers: {
        "X-CSRF-TOKEN": csrf
    },
    dataType: "json",
    success: function (data) {
      console.log(data);
    }
  });
</script>

我不知道 X-CRSF-TOKEN header 或 _csrf_token 参数是否必需，或两者都需要，所以我将尝试通过反复试验找出答案。

Phoenix CSRF 令牌不匹配

Phoenix CSRF token not matching

csrf

elixir

phoenix-framework