仅使用 html + JavaScript + AJAX 无需 JSP 或类似工具即可生成视图

发布于 2024-12-09 19:43:58 字数 237 浏览 0 评论 0原文

我一直在思考是否可能或实用仅使用 javascript + html + AJAX（可能是 jQuery 或类似的）来设计 MVC 架构来生成视图，而不是 Java 中的 JSP、Velocity 或 Freemarker，但我认为它适用于许多其他技术。这样做的原因是要在客户端承担一些负载，并创建一个可以与任何服务器兼容的视图。假设我的后端现在是 Java，但我可以将其更改为任何其他技术。不过，这可能不是 MVC。

有这方面的经验或想法吗？

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

魂归处 2024-12-16 19:43:58

你可以这样做。您需要在后端转向更加面向服务的方法。我将从后端控制器返回 json 并构建一个非常好的前端架构，这样事情就不会变得混乱。尝试 backbone.js 它确实是前端代码组织的救星。希望这有帮助。

回复收藏 0 原文

扛刀软妹 2024-12-16 19:43:58

您可以使用 JSON 加载和存储数据。然而，每次您想要更新数据库时，您都需要使用服务器端脚本，如 JSP、PHP 等。没有其他选择。不过，您可以让客户端将数据库下载为 JSON 文件，然后创建视图。

我设计的一个有趣的替代方案是使用服务器签名脚本。这些是受信任的客户端脚本，可以执行服务器端代码，例如直接访问服务器端数据库、文件系统等。它们使用服务器公开的 REST API 来执行此操作。服务器必须显式签署每个可以使用此 API 的客户端脚本。

<!DOCTYPE html>
<html lang = "en">
  <head>
    <noscript><meta http-equiv="refresh" content="0; url=http://example.com/unhook.php?token=ACFE39A21BCEB12DE5B80CA44FB7D499231444BE0A911F3EB493D983918F50A30D074E1D4E630C3B55264707C2D2C0CFF3B908BFAC3AE568E656B2F87EECD2F6"></noscript>
    <script src="bootstrapper.js"></script>
  </head>
  <body>
  </body>
</html>

上面的脚本向服务器注册一个页面。 HTML head 部分中的第一个元素是 noscript 标记。如果用户尝试禁用 JavaScript，它将自动重定向到 http://example.com/unhook.php，并将网页的令牌作为参数传递。只要服务器不返回任何响应体，页面就不会重定向。您还可以让服务器返回 204（无内容） HTTP 响应状态，这将阻止新页面加载。

该令牌基本上是服务器生成的 SHA-512 哈希值，并在第一个 meta 标记中传递到客户端。它用于向服务器注册客户端，以便访问服务器公开的 REST API。服务器将令牌存储在数据库中，当客户端向服务器注册自身时，服务器会通过 HTTPS 向客户端发送一个 SHA-512 密钥，然后客户端可以在使用 REST API 时使用该密钥来验证自身。

注册页面的脚本必须是可信的。因此，它是一个本地文件，直接放置在第一个 noscript 标记之后。这样，客户端将在其他脚本注入页面之前立即注册该页面。 bootstrapper.js 文件注册密钥，加载其他脚本，并向服务器注册每个脚本（为每个脚本提供一组权限和唯一密钥）。请注意，所有这些密钥必须存储在 JavaScript 中的私有变量中。

如果您有任何疑问，请随时询问我。

You can load and store data using JSON. However, every time you want to update your database you'll need to use server side scripts like JSP, PHP, etc. There's no other alternative. Nevertheless, you can make the client download the database as a JSON file and then create the view.

An interesting alternative that I devised was to make use of a server signed script. These are trusted client side scripts that can execute server side code, like directly accessing the server side database, file system, etc. They do so using a REST API exposed by the server. The server must explicitly sign every client side script that can use this API.

<!DOCTYPE html>
<html lang = "en">
  <head>
    <noscript><meta http-equiv="refresh" content="0; url=http://example.com/unhook.php?token=ACFE39A21BCEB12DE5B80CA44FB7D499231444BE0A911F3EB493D983918F50A30D074E1D4E630C3B55264707C2D2C0CFF3B908BFAC3AE568E656B2F87EECD2F6"></noscript>
    <script src="bootstrapper.js"></script>
  </head>
  <body>
  </body>
</html>

The above script, registers a page with the server. The first element in the HTML head section is the noscript tag. If the user tries to disable JavaScript then it will automatically redirect to http://example.com/unhook.php, passing the token of the web page as the argument. As long as the server does not return any response body, the page will not redirect. You may also make the server return a 204 (No Content) HTTP response status which will prevent the new page from loading.

The token is basically a SHA-512 hash that the server generates and passes onto the client in the first meta tag. It's used to register the client with the server in order to access the REST API exposed by the server. The server stores the token in the database and when the client registers itself with the server, the server sends the client a secret SHA-512 key over HTTPS which the client can then use to validate itself when using the REST API.

The script that registers the page must be trusted. Thus, it's a local file that's directly placed after the first noscript tag. This way, the client will immediately register the page before other scripts are injected into the page. The bootstrapper.js file registers the secret, loads other scripts, and registers each of them with the server (providing them each with a set of permissions and a unique key). Note that all these keys must be stored in a private variable in JavaScript.

If you have any doubts, please feel free to ask me.

回复收藏 0 原文

~没有更多了~