如何使用 AntiForgeryToken 将 MVC 视图模型传递给 AJAX 调用

Question

下面的代码对我有用，但我试图找到一种从表单中读取所有值的方法，而不必在 JavaScript 中重新创建视图模型（vm 是对象参数的名称)。

我尝试将表单序列化并传入，但可能我的语法不正确。

有什么建议吗？

$.ajax({
    type: "POST",
    dataType: "json",
    url: "/post-details-save",
    data: addAntiForgeryToken({
        vm: ({
            Id: $("#PostImageDetails_Id").val(),
            Title: $("#PostImageDetails_Title").val(),
            Description: $("#PostImageDetails_Description").val(),
            CopyrightOwner: $("#PostImageDetails_CopyrightOwner").val(),
            CopyrightUrl: $("#PostImageDetails_CopyrightUrl").val(),
            SourceName: $("#PostImageDetails_SourceName").val(),
            SourceUrl: $("#PostImageDetails_SourceUrl").val(),
            SourceLicenseType: $("#PostImageDetails_SourceLicenseType").val()
        })
    }),
    success: postDetailsSaveSuccess,
    error: postDetailsSaveError
});

Answer 1

确认表单设置

@using (Html.BeginForm("ActionName", "ControllerName", FormMethod.Post, new { @id = "formID" }))

我在部分视图中提交表单时做过类似的事情。

基本上，你需要确认你的html表单设置正确：

AntiForgeryToken

@Html.AntiForgeryToken()

数据字段

在 name 属性很重要的情况下，可能类似于以下内容。

<input type="hidden" name="ApproveUserID" id="ApproveUserID" value="@Model.ApproveUserID" />

AJAX 表单

如果您的表单设置正确，如上所述，您将能够通过 AJAX 提交数据，类似于下面的 JS。

var form = $("#formID");
$.ajax({
    url: form.attr('action'),
    type: form.attr('method'),
    data: form.serialize(), // data to be submitted
    success: function (response) {
        if (response == "Success") {
            //DO SUCCESS STUFF
        } else
        {
            //DO FAILURE STUFF
        }
    },
    error: function () {
            //DO ERROR STUFF
    }
});

---

专业提示：

您始终可以通过放置来扩展您发送的数据

var formData = form.serialize();

进入一个变量并从那里扩展它。

祝你好运。