如何在JSP页面获取Struts2 Action返回的JSON嵌套对象数组并迭代展示

下面分两种常见场景给出实现方案，根据你的实际需求选择：

场景1：异步AJAX获取JSON并渲染（前后端分离风格） #

这种方式适合需要动态加载数据的场景，Action专门返回JSON数据，JSP通过AJAX请求获取后渲染。

1.1 编写Action类及嵌套对象 #

确保Action中的数据属性提供getter方法，JSON插件需要通过getter读取数据进行序列化：

public class UserAction extends ActionSupport {
    private List<User> userList;

    // 返回JSON的方法
    public String getUserJson() {
        // 模拟业务数据，实际可从数据库/服务层获取
        userList = new ArrayList<>();
        Address addr1 = new Address("北京", "朝阳区");
        User user1 = new User("张三", 25, addr1);
        Address addr2 = new Address("上海", "浦东新区");
        User user2 = new User("李四", 30, addr2);
        userList.add(user1);
        userList.add(user2);
        return SUCCESS;
    }

    // 必须提供getter，JSON插件依赖它读取数据
    public List<User> getUserList() {
        return userList;
    }
}

// 嵌套的用户类
class User {
    private String name;
    private int age;
    private Address address;

    public User(String name, int age, Address address) {
        this.name = name;
        this.age = age;
        this.address = address;
    }

    // 所有属性的getter方法
    public String getName() { return name; }
    public int getAge() { return age; }
    public Address getAddress() { return address; }
}

// 嵌套的地址类
class Address {
    private String city;
    private String district;

    public Address(String city, String district) {
        this.city = city;
        this.district = district;
    }

    // 所有属性的getter方法
    public String getCity() { return city; }
    public String getDistrict() { return district; }
}

1.2 配置Struts.xml启用JSON结果类型 #

需要继承json-default包，指定返回JSON的根属性：

<struts>
    <package name="user" extends="json-default">
        <action name="getUserJson" class="com.example.UserAction" method="getUserJson">
            <result type="json">
                <!-- 指定要序列化返回的根对象，这里是userList数组 -->
                <param name="root">userList</param>
            </result>
        </action>
    </package>
</struts>

1.3 JSP页面通过AJAX获取并渲染数据 #

这里提供jQuery和原生JS两种写法，选你熟悉的即可：

用jQuery实现：

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>用户列表</title>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <style>
        .user-item { border:1px solid #ccc; padding:10px; margin:10px 0; border-radius:4px; }
    </style>
    <script>
        $(function() {
            $.ajax({
                url: "${pageContext.request.contextPath}/getUserJson.action",
                type: "GET",
                dataType: "json",
                success: function(userArray) {
                    let html = '';
                    // 迭代JSON数组，嵌套对象通过.访问属性
                    $.each(userArray, function(idx, user) {
                        html += `<div class="user-item">
                                    <p>姓名：${user.name}</p>
                                    <p>年龄：${user.age}</p>
                                    <p>地址：${user.address.city} ${user.address.district}</p>
                                  </div>`;
                    });
                    $('#userContainer').html(html);
                },
                error: function(err) {
                    console.error('加载数据失败:', err);
                }
            });
        });
    </script>
</head>
<body>
    <h3>用户信息列表</h3>
    <div id="userContainer"></div>
</body>
</html>

用原生JS实现：

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>用户列表</title>
    <style>
        .user-item { border:1px solid #ccc; padding:10px; margin:10px 0; border-radius:4px; }
    </style>
    <script>
        window.onload = function() {
            const xhr = new XMLHttpRequest();
            xhr.open('GET', '${pageContext.request.contextPath}/getUserJson.action', true);
            xhr.onreadystatechange = function() {
                if (xhr.readyState === 4 && xhr.status === 200) {
                    const userArray = JSON.parse(xhr.responseText);
                    const container = document.getElementById('userContainer');
                    let html = '';
                    // 循环迭代数组
                    for (let i = 0; i < userArray.length; i++) {
                        const user = userArray[i];
                        html += `<div class="user-item">
                                    <p>姓名：${user.name}</p>
                                    <p>年龄：${user.age}</p>
                                    <p>地址：${user.address.city} ${user.address.district}</p>
                                  </div>`;
                    }
                    container.innerHTML = html;
                }
            };
            xhr.send();
        };
    </script>
</head>
<body>
    <h3>用户信息列表</h3>
    <div id="userContainer"></div>
</body>
</html>

场景2：服务器端直接渲染（传统Struts2页面跳转风格） #

如果不需要异步加载，Action可以直接跳转到JSP，通过Struts2标签迭代数据。

2.1 修改Action方法返回页面跳转结果 #

public class UserAction extends ActionSupport {
    private List<User> userList;

    // 返回页面跳转的方法
    public String showUserList() {
        // 模拟业务数据
        userList = new ArrayList<>();
        Address addr1 = new Address("北京", "朝阳区");
        User user1 = new User("张三", 25, addr1);
        Address addr2 = new Address("上海", "浦东新区");
        User user2 = new User("李四", 30, addr2);
        userList.add(user1);
        userList.add(user2);
        return SUCCESS;
    }

    public List<User> getUserList() {
        return userList;
    }
}

2.2 配置Struts.xml跳转JSP #

<struts>
    <package name="user" extends="struts-default">
        <action name="showUserList" class="com.example.UserAction" method="showUserList">
            <result name="success">/userList.jsp</result>
        </action>
    </package>
</struts>

2.3 JSP页面用Struts2标签迭代渲染 #

引入Struts标签库后，用<s:iterator>遍历数据，嵌套对象通过#对象.属性访问：

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="s" uri="/struts-tags" %>
<html>
<head>
    <title>用户列表</title>
    <style>
        .user-item { border:1px solid #ccc; padding:10px; margin:10px 0; border-radius:4px; }
    </style>
</head>
<body>
    <h3>用户信息列表</h3>
    <div id="userContainer">
        <s:iterator value="userList" var="user">
            <div class="user-item">
                <p>姓名：<s:property value="#user.name"/></p>
                <p>年龄：<s:property value="#user.age"/></p>
                <p>地址：<s:property value="#user.address.city"/> <s:property value="#user.address.district"/></p>
            </div>
        </s:iterator>
    </div>
</body>
</html>

注意事项 #

• 若使用JSON插件，需确保项目中引入了Struts2 JSON依赖（Maven项目可添加对应依赖）。
• 所有需要序列化或通过标签访问的对象属性，必须提供getter方法，否则无法读取数据。
• 若用户输入包含特殊字符，建议对输出内容进行转义，避免XSS攻击（比如在JS中使用textContent而非直接拼接HTML，或使用Struts标签的转义属性）。

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