如何使用 MVC 模式设计 Web 表单答案

【问题标题】：How to design a web form using MVC pattern如何使用 MVC 模式设计 Web 表单
【发布时间】：2016-10-14 05:37:32
【问题描述】：

我是 Java 中的 Restful Web 服务的新手，并试图通过使用 MVC 设计模式来发现它。

我有一个带有一个按钮和一个输入文本框的简单 HTML 表单。当用户在文本框中输入内容时，我想将这些数据存储在 DB 中。

这是我的 HTML 代码的一部分：

<input type="button" onclick="doneButton()" value="Done" />

当按钮被点击时，我调用“doneButton()”函数为

<script>
      function doneButton() {

        var param = document.getElementById("text").value;
        var xhttp = new XMLHttpRequest();
        xhttp.onreadystatechange = function() {
            if (xhttp.readyState == 4 && xhttp.status == 200) {
                document.getElementById("text").innerHTML = xhttp.responseText;
            }
        };
                xhttp.open("GET","MYURL"+param);
        xhttp.send();
    }
</script>

我可以通过上面的 AJAX 代码调用我的 RestFul Web 服务。

在我的网络服务中，我调用我的模型类并在那里建立数据库连接。之后，我从我的模型类中调用我的 DAO 类并将所需的数据存储在 DB 表中。

据我所知MVC设计模式：

我不应该直接从视图中调用 Web 服务。我应该先打电话

视图中的控制器
此控制器应调用 Restful Web 服务。
Web 服务应该调用模型类。
模型类应该对 DAO 和 DB 操作进行分类。

这在 MVC 设计模式方面是否正确？

我可以在 MVC 设计模式中直接从视图中调用 Restful Web 服务吗？

我在 web.xml 中使用球衣：

RESTful 服务 com.sun.jersey.spi.container.servlet.ServletContainer 1 RESTful 服务 /网页服务/*

能否请您帮助我了解如何使用 MVC 设计模式构建我的应用程序？

感谢您的帮助。

最好的问候

【问题讨论】：

标签： java spring-mvc design-patterns model-view-controller

【解决方案1】：

让我为你澄清一下：

View 对 controller 进行 RESTful 调用。换句话说，您的 控制器 是 RESTful Web 服务中的一个 API。
Controller 调用 DAO 层，该层又从底层数据库返回数据。
Controller 使用返回的数据，也称为 model，将响应返回给 view。

【讨论】：

【解决方案2】：

这只是一个例子，希望对你有帮助

$(document).ready(function() {
            $('#response_button').on('click', function() {

//              console.log($('#request_textarea').val()); //get your values you need to send to the controller

                $.ajax({
                    type : "GET",
                    url : "url", //call to your controller here.
                    data : "xmlRequest=" + $('#request_textarea').val() + "&functionType=submit_request",    //append your data here 
                    success : function(msg) {
                        $("#response_textarea").text(msg); //response from the controller will be processed here.

                    }
                });

            });
        });

通过服务层调用您的 DAO 层并将数据返回给 UI。要回答您的问题之一，您可以从视图中调用控制器。

【讨论】：

【解决方案3】：

谢谢你的提问。

首先我想告诉你，你的基本想法是对的。

您不应直接从视图调用 Web 服务。

事实上，控制器是您显示应用程序视图的入口点。

但我认为对“视图”一词有一点误解。

对于大多数 MVC 框架，视图是某种模板，由 HTML 和几个数据占位符组成。

控制器可能会调用 REST 服务。它也可能通过直接查询数据库来获取它的数据。如何检索数据在很大程度上取决于控制器的实际实现。

然而，像 Angular.js 这样的客户端 MVC 框架通常设计为与 REST 服务一起使用。

因此，如果您想使用 Javascript MVC 框架，则使用 REST 服务进行数据操作是一个好主意。

现在控制器做什么？

控制器侦听特定资源（URL）并做出响应。它通过将（视图）模型绑定到请求的视图（通常是 HTML 模板）来做到这一点。

它基本上用实际数据替换视图定义中的占位符，并将完成的 HTML 显示给客户端。

如果表单数据被发布到控制器，它会解析数据并相应地更新视图模型。

那么什么是（视图）模型，它是如何填充数据的？

嗯，（视图）模型是 MVC 中的 M。它是绑定到视图的实际模型。在某些情况下，视图模型可能与域模型一致。当您使用基于 javascript 的 MVC 框架时，通常会出现这种情况。因此，您的视图模型不仅仅是一个简单的数据模型，它包含绑定到特定视图模板的占位符的数据。它就 js MVC 框架而言，它还可能包含由控制器调用的业务逻辑……在 javascript 中……在客户端。 -> 这就是缺点。

在您的情况下，所有数据库操作都由 REST 服务处理。所以你有一个服务器端组件，它有自己的数据模型，它独立于 MVC 结构化表示层。因此，REST 服务不是 MVC 方法的一部分！因此，如果您愿意，您仍然可以在 REST 服务操作中实现服务器端验证。但请记住，您的客户端控制器必须在客户端（视图和域模型）和服务器端（域和/或持久性模型²）之间进行转换。

² 贫血领域模型的更好用词。

路线图：

找到问题的答案：我是构建自己的 MVC 框架（提示：坏主意！）还是使用现有的 MVC 框架来利用 MVC 方法？
选择适合您需要的 MVC 框架并下载。
创建模型、视图和控制器。

但在您真正考虑构建 MVC 结构化表示层之前，您可能想了解什么是 REST 服务以及它是如何构建和创建的。

希望对你有帮助。

编码愉快！

【讨论】：