AJAX AntiForgery Token 不调用控制器方法

AJAX AntiForgery Token not calling controller method

我很难用 [ValidateAntiForgeryToken] 属性调用我的控制器方法。

我的cshtml/js代码:

    var wizardRegisterJsonRequest = {
        Email: email,
        Password: password,
        ConfirmPassword: confirmPassword,
        Name: name
    };


    $.ajax({
        type: 'POST',
        dataType: "html",
        url: 'http://localhost:50209/GetAllFonts/WizardRegister',
        data: AddAntiForgeryToken(wizardRegisterJsonRequest),
        beforeSend: function () {
            $('#create_account_form').data('busy', true);
            $('#create_account_busy').show();
        },
        success: function (data) {
            if (data.Success === true) {
                // all good here
            }

            $('#create_account_validation_summary').text(data.Message);
            $('#create_account_validation_summary').show();
        },
        complete: function () {
            $('#create_account_form').data('busy', false);
            $('#create_account_busy').hide();
        }
    });

    AddAntiForgeryToken = function (data) {
            alert("adding anti forgery");
          data.__RequestVerificationToken = $('#anti_forgery_token').val();
          return data;
    };

控制器代码:

    [ValidateAntiForgeryToken]
    [HttpPost]
    public JsonResult WizardRegister(User usrDetails)
    //public JsonResult WizardLogOn(User usr)
    {
        // string test = ""; // this method WizardRegister is not getting called
    }

用户模型:

public class User
{
    public string Email { get; set; }
    public string Password { get; set; }
    public string ConfirmPassword { get; set; }
    public string Name { get; set; }
    public string Phone { get; set; }
    public string __RequestVerificationToken { get; set; }
}

我不确定在用户模型中是否需要 __RequestVerificationToken。我是第一次使用 AntiForgery

请让我知道哪里出错了...

谢谢, 洛汗.

更新:

查看/表单代码:

@using (Html.BeginForm(null, null, FormMethod.Post, new { id = "create_account_form" }))
{
    @Html.AntiForgeryToken()
    <fieldset>
        <div class="input-fixed">
            <span class="mandatory_wizard">* </span>
            <input type="text" id="registrName" name="registrName" value="rohan" class="name" placeholder="Name">
        </div>
        <div class="input-fixed">
            <span class="mandatory_wizard">* </span>
            <input type="text" id="registrEmail" name="registrEmail" class="email" value="rohanskosht@gmail.com" placeholder="Email">
        </div>
        <div class="input-fixed">
            <span class="mandatory_wizard">&nbsp; </span>
            <input type="text" class="phone" placeholder="Phone Number">
        </div>
        <div class="input-fixed">
            <span class="mandatory_wizard">* </span>
            <input type="password" id="registerPassword" name="registerPassword" value="12345678" class="password" placeholder="Password: Must be longer than 8 characters.">
        </div>
        <div class="input-fixed">
            <span class="mandatory_wizard">* </span>
            <input type="password" id="registerConfirmPassword" name="registerConfirmPassword" value="12345678" class="confirm-password" placeholder="Confirm Password">
        </div>
        <input type="submit" class="btn-modal-login" value="Create your account &gt;&gt;">
        <img id="create_account_busy" style="display: none;" src="./Launch Campaign _ Teeyoot_files/busy.gif" alt="Loading...">
    </fieldset>
}

@Html.AntiForgeryToken() 使用 name="__RequestVerificationToken" 生成隐藏输入。 (它没有 id 属性,因此 $('#anti_forgery_token').val(); 将 return 未定义。

您可以使用

访问该值
var token= $('[name=__RequestVerificationToken]').val();

但是,我强烈建议您使用 HtmlHelper 方法(@Html.TextBoxFor(m => m.Name)@Html.PasswordFor(m => m.Password) 等)为您的属性生成输入,而不是手动生成 html,然后您可以简单地使用

data: $('form').serialize()

在 ajax 调用中(然后您可以删除大部分脚本)。您也不应该对 url 进行硬编码(一旦将其投入生产,它就会失败)。您的脚本只需

$.ajax({
    type: 'POST',
    dataType: "html",
    url: '@Url.Action("WizardRegister", "GetAllFonts")', 
    data: $('form').serialize(),
    beforeSend: function () {
        ....

您还应该为每个 属性 添加 @Html.ValidationMessageFor() 以获得客户端验证,这样就不会提交无效表单。

旁注:从您的代码中不清楚为什么要使用 ajax。如果用户正在注册,那么如果成功则您希望重定向(如果不成功则显示验证错误),因此 ajax 毫无意义