ASP.NET Core中JS调用C#方法实现AD用户实时查询

看起来你踩了Razor Pages和MVC路由差异的坑了——你用的是ASP.NET Razor Pages（从Index.cshtml.cs的结构能看出来），而网上大多是MVC的方案，自然不管用。我来给你一步步捋清楚正确的实现方式：

第一步：修正后端的方法实现 #

在Index.cshtml.cs里，Razor Pages不支持[WebMethod]那套Web Forms的写法，你需要定义一个带Handler前缀的异步Get方法，用来处理前端的查询请求：

using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;

public class IndexModel : PageModel
{
    // 假设你有一个处理AD查询的服务，这里替换成你的实际逻辑
    private readonly IActiveDirectoryService _adService;

    public IndexModel(IActiveDirectoryService adService)
    {
        _adService = adService;
    }

    // 这个方法会被前端通过?handler=FindUser调用
    public async Task<IActionResult> OnGetFindUser(string username)
    {
        // 如果输入为空，直接返回空列表
        if (string.IsNullOrWhiteSpace(username))
        {
            return new JsonResult(Array.Empty<object>());
        }

        // 查询Active Directory匹配的用户，替换成你的实际查询逻辑
        var matchingUsers = await _adService.SearchMatchingUsersAsync(username);
        
        // 返回Json格式的用户列表，比如包含Id和DisplayName字段
        return new JsonResult(matchingUsers);
    }
}

第二步：修改前端的Ajax调用 #

你的Ajax请求有两个核心问题：URL写法错误，以及没有处理Razor Pages默认启用的防伪造令牌验证。修改后的JS代码如下：

function findUsers() {
    // 获取文本框的输入值
    const inputElement = document.querySelector('input.form-control');
    const username = inputElement.value.trim();
    
    // 如果输入为空，清空下拉框并返回
    const dropdown = document.getElementById('userDropdown'); // 替换成你的DropDownList ID
    if (!username) {
        dropdown.innerHTML = '';
        return;
    }

    $.ajax({
        // Razor Pages通过handler参数指定要调用的后端方法
        url: '?handler=FindUser',
        type: 'GET',
        // 把输入的用户名传递给后端
        data: { username: username },
        beforeSend: function(xhr) {
            // 必须带上防伪造令牌，否则请求会被Razor Pages拦截
            xhr.setRequestHeader("XSRF-TOKEN", $('input[name="__RequestVerificationToken"]').val());
        },
        success: function(data) {
            // 清空下拉框，然后填充匹配的用户选项
            dropdown.innerHTML = '';
            data.forEach(user => {
                const option = document.createElement('option');
                option.value = user.Id; // 替换成你的用户ID字段
                option.textContent = user.DisplayName; // 替换成你的用户显示名称字段
                dropdown.appendChild(option);
            });
        },
        error: function(xhr, status, error) {
            // 显示更详细的错误信息，方便调试
            alert(`请求出错: ${xhr.responseText || error}`);
        }
    });
}

第三步：确保视图包含防伪造令牌 #

Razor Pages默认会在表单里自动生成防伪造令牌，但如果你的页面没有用<form>标签，需要手动添加：

@Html.AntiForgeryToken()
<!-- 你的文本框和下拉框 -->
<input type="text" class="form-control" oninput="findUsers()" />
<select id="userDropdown" class="form-control"></select>

为什么之前的方案不生效？ #

• 你用的是Razor Pages，不是MVC也不是Web Forms：[WebMethod]是Web Forms的特性，MVC用路由属性，而Razor Pages用OnGetXXX/OnPostXXX的Handler方法。
• Ajax的URL错误：Razor Pages不支持Index\\FindUser这种路径写法，而是通过?handler=XXX来指定要调用的后端方法。
• 缺少防伪造令牌：Razor Pages默认启用防伪造验证，没有令牌的请求会被直接拒绝，这也是你之前收到错误的重要原因。

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