使用Ajax.ActionLink实现用户注销报错404的原因排查

嘿，我来帮你捋清楚这个问题——你遇到的404错误和URL末尾多出logoutForm的原因很明确，是Ajax.ActionLink的参数传错位置了！

为什么会出问题？ #

你写的@Ajax.ActionLink里，第三个参数是new { id = "logoutForm" }，这个参数对应的是路由参数（routeValues），而不是HTML元素的属性。你的LogOff动作方法既没有定义id参数，项目里也没有匹配这个带id的路由规则，所以MVC会把logoutForm当成路由的一部分拼到URL后面，变成/MySiteName/Account/LogOff/logoutForm，服务器找不到对应的动作方法，自然就返回404了。

正确的写法应该是这样 #

你需要把id="logoutForm"放到**第五个参数（htmlAttributes）**里，而路由参数部分传null就好（因为你不需要给LogOff传额外的路由参数）。另外，考虑到你的LogOff是HttpPost方法，最好处理好请求成功后的跳转，还有防伪造令牌的问题（虽然你注释掉了，但建议加上更安全）：

@Ajax.ActionLink(
    @Resources.Resources.LogOff, 
    "LogOff", 
    "Account", 
    null, // 路由参数不需要，传null
    new AjaxOptions { 
        HttpMethod = "POST",
        // 注销成功后跳转到首页
        OnSuccess = "function() { window.location.href = '@Url.Action(\"Index\", \"Home\")'; }"
    },
    new { id = "logoutForm" } // 这里才是设置HTML元素的id
)

补充：如果开启防伪造令牌的处理 #

如果你把[ValidateAntiForgeryToken]的注释去掉，还需要在Ajax请求里带上这个令牌。可以先在页面里添加令牌：

@Html.AntiForgeryToken()

然后修改AjaxOptions，在请求发起前把令牌加到请求头里：

new AjaxOptions { 
    HttpMethod = "POST",
    OnBegin = "function(xhr) { xhr.setRequestHeader('RequestVerificationToken', $('input[name=\"__RequestVerificationToken\"]').val()); }",
    OnSuccess = "function() { window.location.href = '@Url.Action(\"Index\", \"Home\")'; }"
}

这样调整之后，Ajax请求就会正确指向/MySiteName/Account/LogOff，不会再出现404错误啦。

内容的提问来源于stack exchange，提问作者Michael