如何在HTML展示在线用户列表？AJAX请求404但控制器有数据

看起来你踩了Spring MVC里控制器返回视图和AJAX请求数据的常见坑，我来帮你一步步搞定这个问题：

核心问题在哪？ #

你的控制器方法现在返回的是视图名称（return "loggedUsers"），这是给服务器用来渲染页面的，但AJAX请求要的是JSON格式的原始数据；而且当前控制器是把数据塞到Model里给页面模板用，不是直接返回给AJAX。另外404大概率是请求路径不匹配，或者控制器返回的内容不符合AJAX预期导致的。

第一步：修改控制器，返回JSON数据 #

把控制器改成直接返回在线用户列表的JSON格式，需要添加@ResponseBody注解，Spring会自动把返回的对象转换成JSON：

@RequestMapping(value = "/loggedUsers", method = RequestMethod.GET)
@ResponseBody
public List<User> getLoggedUsers() {
    // 这里假设activeUsers.getUsers()返回的是List<User>类型，根据你实际的类调整
    return activeUsers.getUsers();
}

小提示：如果你的User类有循环引用（比如关联了其他对象），可能需要给相关字段加@JsonIgnore注解，或者配置Jackson的序列化规则避免报错。

第二步：修正AJAX请求，渲染数据 #

确保AJAX的请求路径和控制器的@RequestMapping完全匹配，拿到数据后动态生成页面列表：

$(document).ready(function() {
    $.ajax({
        url: "/loggedUsers", // 注意：如果你的应用有上下文路径（比如部署在/myApp下），要改成"/myApp/loggedUsers"
        type: "GET",
        dataType: "json",
        success: function(users) {
            // 先找到页面里放列表的容器，比如你提前加好的<ul id="userList"></ul>
            const userList = $("#userList");
            userList.empty(); // 清空原有内容
            // 遍历用户列表，生成每个列表项
            $.each(users, function(index, user) {
                // 这里假设User类有username字段，换成你实际的属性名，比如nickname之类的
                userList.append(`<li>${user.username}</li>`);
            });
        },
        error: function(xhr, status, error) {
            // 出错了可以在控制台看详细信息，方便排查
            console.log(`请求出错：${status} - ${error}`);
            console.log(`响应内容：${xhr.responseText}`);
        }
    });
});

第三步：检查404的其他可能原因 #

如果改完还是404，排查这几点：

• 控制器类上有没有加@Controller或者@RestController注解？如果用@RestController，可以不用单独加@ResponseBody，它默认自带这个功能
• 确认应用的上下文路径：比如你的项目跑在http://localhost:8080/myApp，那AJAX的url必须加上/myApp前缀
• 检查Spring的配置，有没有拦截器或者安全配置把/loggedUsers这个路径给挡住了

第四步：准备HTML容器 #

在你的HTML页面里加个用来放用户列表的容器：

<div class="user-list-container">
    <h3>当前在线用户</h3>
    <ul id="userList"></ul>
</div>

这样一套操作下来，AJAX就能正确拿到在线用户数据，然后动态渲染到页面上啦！

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