Python Web 应用程序中的模型-视图-控制器 (MVC)：用乐高解释

如果您对 Web 开发感到好奇，那么您可能遇到过缩写 MVC，它代表模型-视图-控制器。您可能知道这是一种常见的设计模式，是许多 Python Web 框架甚至桌面应用程序的基础。

但这到底是什么意思呢？如果您很难理解这个概念，请继续阅读。

在本教程中，您将：

通过基于乐高的类比理解 MVC 模式
了解什么是模型、视图和控制器概念
将您的概念理解与具体的 Web 开发示例联系起来
研究 Flask 代码片段以阐明要点

也许您小时候用乐高搭建过东西，或者也许您今天仍然是乐高爱好者。但即使您从未将两个乐高积木拼在一起，请继续阅读，因为这个类比可能仍然是您理解的一个很好的基石。

使用我们的交互式“Python Web 应用程序中的模型-视图-控制器 (MVC)：解释方式”测试您的知识乐高”测验。完成后您将收到一个分数，以帮助您跟踪学习进度：

互动测验

在本测验中，您将测试您对模型-视图-控制器 (MVC) 设计模式的理解，这是许多 Python Web 框架中的基本概念。通过完成本测验，您将重新审视模型、视图和控制器的概念，以及它们与具体 Web 开发示例的关系。

用乐高解释模型-视图-控制器模式

想象一下，您十岁，坐在家庭房间的地板上。在你面前是一大桶乐高或类似的模块化积木。有各种不同形状和大小的块：

🟦🟦🟦 有些是蓝色的，又高又长。
🟥 有些是红色的，呈立方体形状。
🟨🟨 有些是黄色的，又大又宽。

有了所有这些不同的乐高积木，你根本不知道可以拼搭出什么！

正当你的脑海里充满了无限的可能性时，你听到沙发方向传来了一些声音。这是你的哥哥，提出了一个特定的请求。他说，“嘿！给我造一艘宇宙飞船！”

“好吧，”你会想，“那实际上可能很酷。”它是一艘宇宙飞船！

这样你就可以开始工作了。你开始拿出你认为需要的乐高积木。有的大，有的小。飞船外部的颜色不同，发动机的颜色也不同。

现在您已将所有构建块就位，是时候组装宇宙飞船了。经过几个小时的努力，你现在面前有一艘宇宙飞船：

                                  🟦
                                🟦🟥🟦
                              🟦🟥🟥🟥🟦
                            🟦🟥🟥🟥🟥🟥🟦
                            🟦🟥🟥🟥🟥🟥🟦
                            🟦🟥🟩🟩🟩🟥🟦
                            🟦🟥🟩🟦🟩🟥🟦
                            🟦🟥🟩🟩🟩🟥🟦
                            🟦🟥🟥🟥🟥🟥🟦
                            🟦🟥🟥🟥🟥🟥🟦
                            🟦🟥🟥🟥🟥🟥🟦
                        🟦🟥🟥🟥🟥🟥🟥🟥🟥🟥🟦
                        🟦🟥🟥🟥🟥🟥🟥🟥🟥🟥🟦
                        🟦🟥🟨🟨🟥🟥🟥🟨🟨🟥🟦
                            🟨🟨       🟨🟨

你跑去找你的兄弟并向他展示成品。 “哇，干得好！”，他说。然后他轻声补充道：

嗯，我几个小时前才要求的，我什么也没做，就在这里。我希望一切都这么简单。
— 你的兄弟

如果我告诉您使用 MVC 模式构建 Web 应用程序就像使用乐高积木构建某些东西一样？

用户发送请求

就乐高宇宙飞船而言，是你的兄弟提出了要求并要求你建造一些东西。对于网络应用程序来说，用户输入 URL 并请求查看某个页面。

控制器解释请求

当你为你的兄弟建造乐高宇宙飞船时，你是控制者。在网络应用程序中，控制器是您编写的代码。

控制器负责理解请求并根据请求采取行动。控制器收集所有必要的构建块并适当地组织它们。

模型创造产品

不同类型的乐高积木就是模型。你有不同的尺寸和形状，你可以抓住建造宇宙飞船所需的那些。在网络应用程序中，模型帮助控制器从数据库中检索制造产品所需的所有信息。

一旦控制器使用模型检索必要的物品，组装最终产品所需的一切都已就位。

视图代表最终产品

在乐高示例中，宇宙飞船就是视图。这是你的兄弟（提出请求的人）看到的最终产品。

在 Web 应用程序中，视图是用户在浏览器中看到的页面。

总结您的乐高冒险之旅

您建造了一艘宇宙飞船，给您的兄弟留下了深刻的印象，并将该过程与使用 MVC 模式构建 Web 应用程序联系起来。这是一个快速回顾，您可以随身携带，以帮助您记住这个故事与 Web 开发的关系。

使用乐高搭建时：

你的兄弟请求你建造一艘宇宙飞船。
您收到请求。
您检索并组织建造宇宙飞船所需的所有乐高积木。
您使用积木建造宇宙飞船并将完成的宇宙飞船呈现给您的兄弟。

这些是通用步骤。您可以重复它们来构建许多不同形状和颜色的乐高积木。

将这个柔和的水彩图像蚀刻到您的大脑中后，您现在可以重新访问该过程的网络应用程序版本来比较它们。

构建网络应用程序时：

用户通过输入 URL 请求查看页面。
控制器接收该请求。
控制器使用模型检索所有必要的数据、组织数据并将其发送到视图。
视图使用它接收到的数据来呈现最终网页并将其在浏览器中呈现给用户。

同样，这些是您的网络应用程序多次执行的通用步骤，以便为您的用户提供各种信息和页面：

如果您在心里将第二个图像存储在第一个图像旁边，那么您就会有一个完整的类比，每当您想记住 MVC 模式的全部内容时都可以参考它。

这是另一个概述，总结在表格中：

	Lego	Website
Wish	Brother’s request	URL request
Execution	You	Controller
Building blocks	Lego	Models
Presentable product	Spaceship	View

干得好！现在您已经将这个类比记入了记忆中，您已经为理解模型-视图-控制器模式奠定了坚实的基础。接下来，您可以更深入地思考，从更技术的角度考虑这一切意味着什么，重点关注 Python Web 开发。

探索 Python Web 开发中的模型-视图-控制器模式

当您在浏览器中键入 URL 来访问 Web 应用程序时，您是在请求查看应用程序中的特定页面。但是应用程序如何知道要渲染和显示哪个页面呢？

构建网络应用程序时，您可以定义所谓的路由。本质上，路由是与不同页面关联的 URL 模式。因此，当有人输入 URL 时，应用程序会尝试将该 URL 与幕后的预定义路由之一相匹配。

因此，这里确实有四个主要组件在起作用：控制器、模型、视图和路线。

路由请求

每条路线都与一个控制器相关联。更具体地说，它与控制器内的某个功能相关联，称为控制器操作。因此，当您输入 URL 时，应用程序会尝试查找匹配的路由。如果成功，则会调用该路由的关联控制器操作。

您可以通过考虑基本的 Flask 路线作为示例来开始学习模型-视图-控制器模式在 Python Web 开发中的工作原理：

# ...

@app.route("/")
def home():
    pass

在这里，您确定基本路由 ("/") 与 home() 视图函数关联，该函数在概念上是一个控制器操作。当有人请求该基本路由时，您的网络应用程序将调用 home()。

编码模型和控制器

在控制器操作中，您通常会做两件主要事情：

您可以使用模型从数据库中检索所有必要的数据。
您将该数据传递给视图，该视图呈现所请求的页面。

通常，您会将通过模型检索到的数据添加到数据结构中，例如列表或字典。然后，将该数据结构发送到视图。

继续使用以下功能扩展您的 Flask 示例应用程序：

# ...

@app.route("/")
def home():
    """Searches the database for entries, then displays them."""
    db = get_db()
    cur = db.execute("SELECT * FROM entries ORDER BY id DESC;")
    entries = cur.fetchall()
    return render_template("index.html", entries=entries)

在更新的视图函数中，您在第 6 行到第 8 行中从数据库获取数据。您在此代码段中看到的 get_db() 函数是数据库连接器函数的占位符。您需要为此函数编写代码，以便它能够与您使用的数据库（例如 Python SQL 库）配合使用。

注意：这些示例中的代码从概念上解释了 Flask 应用程序的流程，但它并不完全像这样孤立地工作。如果您下载了材料存储库，那么您将获得一个功能齐全的 Flask 示例应用程序，它使用相同的代码，但还添加了必要的 Flask 样板代码和脚本来构建您可以与之交互的 SQLite 数据库。

在第 8 行中，您最终得到一个列表，并将其分配给变量 entries。然后，在第 9 行，您将该列表发送到 index.html 模板，并通过您也称为 entries 的变量访问数据。

建立观点

最后，index.html 文件代表您的视图。由于您使用控制器操作将数据结构发送到模板文件，因此您现在可以访问其中的数据。然后，您可以使用数据结构中包含的信息来呈现用户最终在浏览器中看到的页面的 HTML 内容。

在 Flask 应用示例中，您可以循环遍历条目并使用 Jinja 语法显示每个条目：

...

<ul>
    {% for entry in entries %}
        <li>
        <strong>{{ entry[1] }}:</strong>
        {{ entry[2] }}
        </li>
    {% else %}
        <li>No entries yet. Add some!</li>
    {% endfor %}
</ul>

...

如果您的数据库中有条目，那么您的用户将看到一个接一个列出的所有条目。您还在第 9 行添加了一个可选的 else 子句，如果还没有任何条目，它会呈现一条描述性文本消息。

总结模型-视图-控制器模式

现在，您已经围绕模型-视图-控制器模式的概念进行了第二圈，这次使用 Python 的 Flask Web 框架作为指导。以下是 MVC 请求流程的更详细的技术摘要：

用户通过输入 URL 请求查看页面。
应用程序将 URL 与预定义的路由相匹配。
应用程序调用与路由关联的控制器操作。
控制器操作使用模型从数据库中检索所有必要的数据，将数据放入数据结构中，并加载视图，并传递数据结构。
视图访问数据结构并使用它来呈现所请求的页面，然后应用程序将其在浏览器中呈现给用户。

这与为你的兄弟建造乐高宇宙飞船不太一样，但也许你可以看到这两个过程中概念上的相似之处。

如果您想使用示例 Flask 应用程序并探索运行它所需的附加代码，那么您可以在此处下载代码：