在Phoenix框架中使用jquery ajax post提交post请求

我们希望使用可编辑的内容，利用router.ex中生成的具有以下内容的路由：

  pipeline :browser do
    plug :accepts, ["html"]
    plug :fetch_session
    plug :fetch_flash
    plug :put_secure_browser_headers
  end

  pipeline :api do
    plug :accepts, ["json"]
  end
  scope "/", TextEditor do
    pipe_through :browser # Use the default browser stack

    get "/", PageController, :index
    resources "/posts", PostController
  end

以及控制器功能，即创建：

  def create(conn, %{"post" => post_params}) do
    changeset = Post.changeset(%Post{}, post_params)

    case Repo.insert(changeset) do
      {:ok, _post} ->
        conn
        |> put_flash(:info, "Post created successfully.")
        |> redirect(to: post_path(conn, :index))
      {:error, changeset} ->
        render(conn, "new.html", changeset: changeset)
    end
  end

但是，我们不想使用生成的表单，我们正在尝试使用divs和jquery方法$.post对此进行测试：

<div id="newPost" contenteditable="true">write here</div>
<div id="button" class="btn btn-primary">Save</div>

<script type="text/javascript">
$(document).ready(function(){
  $("#button").click(function() {
    var post = $("#newPost").html();

    $.post( "/posts/post", { title: post })
     .done(function() {
        alert( "Data Loaded: " );
    });
  });
});
</script>

写在这里
拯救
$（文档）.ready（函数（）{
$（“#按钮”）。单击（函数（）{
var post=$（“#newPost”）.html（）；
$.post（“/posts/post”，{title:post}）
.done（函数（）{
警报（“数据加载：”）；
});
});
});

但是，我们没有收到警报或任何数据插入我们的数据库。 我们错过了什么

编辑：由于csrf令牌错误，我们在浏览器管道中删除了交叉伪造插件。

请尝试以下操作：

$.post( "/posts", { post: { title: post } })

控制器希望参数嵌套在

post

def create(conn, %{"post" => post_params}) do

我不建议您这样做，但您可以将控制器更改为：

def create(conn, %{} = post_params) do

在不使用root

post

键的情况下查找参数。但是，使用

post

键意味着您可以轻松获得与表单无关的其他参数

我也不建议禁用CSRF检查。通过将CSRF令牌存储在元标记中，您可以轻松提交：

<meta name="csrf" content="<%= Plug.CSRFProtection.get_csrf_token() %>">

---

你的控制台有错误吗？您能发布您的

浏览器
管道吗？没有错误。在控制台中，我们得到：
[info]POST/posts/POST
。我在问题中添加了浏览器管道。由于csrf令牌错误，我们删除了交叉伪造插件。这并不是说您应该这样做作为解决方案，但如果您删除
：put_secure_browser_headers
，您是否可以检查它是否有效？我测试了它，但删除它后它不起作用。我们还遇到了参数问题，这就是为什么我们在“/posts/”（“/posts/post”）中添加了“post”的原因.它有效，但csrf令牌无效。如果我将其从管道中删除，它就可以工作。我已经设法使用上述代码发出PUT请求（更新），但问题是，当我尝试（在我的控制器的更新函数中）获取当前登录用户（进行jQuery AJAX调用的用户）的id时，我得到了
会话未获取
错误。我需要用户id以限制用户仅更新与其用户id关联的实体的能力。
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);
    }
});