如何实现来自 java servlet 的图像幻灯片放映，而不需要在 html 中对图像进行硬编码？

Question

作为学习练习，我改编了 BalusC 编写的一系列 Java servlet 来存储上传到 mysql 数据库中的图像列表。该应用程序运行良好，并按照从数据库静态读取的顺序以 html 形式显示图像列表。然而，我正在尝试调整 html 以在幻灯片中动态显示这些内容。我在互联网上找到了几个示例，但它们似乎都在浏览器代码中硬编码了图像名称。我正在寻找某种方法将从数据库查询读取的图像传输到客户端中的幻灯片。

原始来源在这里

研究了几个例子后，似乎使用 javascript 是最常见的这样做的方法，但我找不到一个动态执行此操作的示例，这是我的尝试（我在 java servlet 中使用嵌入了 html 的 javascript），但它无法执行更多操作，无法连续打印出图像的标题页面上的列表（但没有图像）：

try {
        Class.forName(driver);
        Connection con = DriverManager.getConnection(url+dbName, userName, password);
        PreparedStatement ps = con.prepareStatement("select * from photos");
        ResultSet rs = ps.executeQuery();
        out.println("<h1>Photos</h1>");
        while ( rs.next()) {
              out.println("<h4>" + rs.getString("title") + "</h4>");
              out.println("<script type=\"text/javascript\">");
              out.println(" function clearScreen(){");
              out.println(" document.image.src=displayphoto?id=\" +  rs.getString(\"id\")\"");
              out.println(" document.body.innerHTML=\"\";");
              out.println(" setTimeout('clearScreen()','5000');}");
              out.println("</script>");
        }

        con.close();
    }

任何关于更好的方法的指示或建议，甚至纯粹使用 Java servlet，都将不胜感激。

非常感谢

阿拉斯泰尔

Answer 1

此代码生成一个

目前还不清楚你想做什么。要进行幻灯片放映，您必须迭代图片 ID 列表。您可以将此 ID 列表存储

• 为 HTML 代码中的 JavaScript 数组。 Servlet 代码必须生成 JavaScript 代码，
• 在会话属性中将 ID 数组定义为服务器端的迭代器。要显示下一张照片，displayphoto servlet 必须从会话中获取迭代器，获取其下一个 ID，并提供
• 不具有此 ID 的图像的字节。每次必须显示新照片时，其索引将被传递到 displayphoto servlet，并且该 servlet 将生成 SQL 查询以获取该索引处的照片。当然，SQL 查询必须使用某种排序顺序才能始终以相同的顺序返回照片。

如果你的目标是实现第一个解决方案，那确实不难。以下是在 JavaScript 中声明包含三个 ID（id1、id2 和 id3）的数组的方式：

var ids = ['id1', 'id2', 'id3'];

因此，您所要做的就是从包含 的 List 生成上述字符串。 “id1”、“id2” 和 “id3”。一个简单的循环就可以了：

StringBuilder jsArrayDeclaration = new StringBuilder();
jsArrayDeclaration.append("var ids = [");
boolean first = true;
for (String id : listOfIds) {
    if (!first) {
        jsArrayDeclaration.append(", ");
    }
    first = false;
    jsArrayDeclaration.append("'");
    jsArrayDeclaration.append(id);
    jsArrayDeclaration.append("'");
}
jsArrayDeclaration.append("];");