乐高!
你已经十岁了,坐在你家的房间里,在你面前是一大桶乐高,有各种形状、大小。有些是蓝色、高大而且很长,就像拖拉机拖车一样,一些是红色的和几乎立方体的形状,有些是黄色的,像大宽大飞机翼,像玻璃片。有了所有这些这些类型的乐高,不知道你可以建立什么。
但惊喜的是,已经有一个请求request,你哥哥跑上前说:“嘿!帮我建造一个宇宙飞船!”
“好吧,”你认为,“宇宙飞船,实际上很酷!”
所以你开始工作,你开始找出你需要的乐高。有些大,有些小。飞船外部的颜色越来越多,发动机的颜色也越来越多,武器也有不同的颜色。
现在,你拥有所有的积木building blocks,是时候组装宇宙飞船。经过几个小时的辛苦工作,现在你面前有一艘宇宙飞船!
你跑去找你哥哥给他看成品。“哇,干得漂亮!”他想,“几个小时前我才问,不必做一件事,就在那儿,我希望一切都是容易的。”
如果我告诉你构建一个Web应用程序就像使用乐高构建一样,那该怎么办?
这一切都从请求request开始...
以乐高为例,是你哥哥让你建点东西。在Web应用中,用户输入 URL,请求查看特定页面。所以你的兄弟是用户。
请求到达控制器controller...
在刚刚的例子中,你是控制器。控制器负责抓取所有必要的构建基块,并在必要时对其进行组织。
这些构建基块被称为模型model...
不同类型的乐高是模型。你有所有不同的尺寸和形状,你找到你需要建立宇宙飞船的组件。在Web应用中,模型可帮助控制器从数据库中检索所需的所有信息。
所以请求来了...
控制器(您)收到请求。它进入模型 (乐高) 检索必要的项目。现在,一切都已经到位,以生产最终的产品。
最终产品称为视图view...
宇宙飞船就是视图。最终向提出请求的人(你的兄弟)展示的是最终产品。
在Web应用程序中,视图是用户在其浏览器中最后看到的页面。
总结...
用乐高建造时:
你哥哥要求你造宇宙飞船。
您收到请求。
你检索和组织建造宇宙飞船所需的所有乐高。
你用乐高建造宇宙飞船,把完工的宇宙飞船呈现给你的兄弟。
在Web应用中:
用户通过输入URL请求查看页面。
控制器收到该请求。
它使用模型检索所有必要的数据,组织它,并将其发送到视图。
视图然后使用该数据呈现在浏览器中呈现给用户的最终网页。
从更技术的角度来看
总结MVC框架后,让我们深入了解一下所有这些,在更加技术层面上的运作方式。
当您在浏览器中键入URL,访问Web应用程序时,您正在请求查看应用程序中的某个页面。但是,应用程序如何知道要显示/呈现哪个页面呢?
构建 Web 应用时,可以定义所谓的路由。路由本质上是与不同页面关联的URL模式。因此,当有人输入URL时,在后台,应用程序会尝试将该URL与这些预定义的路由之一匹配。
因此,事实上,有四个主要组件在起作用:路由、模型、视图和控制器。
路由routes
每个路由都与控制器相关联,具体来说,控制器中的特定函数,称为控制器操作。因此,当您输入URL时,应用程序将尝试查找匹配的路由,如果成功,它将调用该路由的关联控制器操作。
让我们以一个基本的Flask路由为例:
@app.route('/')
def main_page():
pass
在这里,我们建立根路经/路由与main_page()关联的视图函数。
模型models与控制器controllers
在控制器操作中,通常发生两个主要事件:模型用于从数据库中读取所有必要的数据;二是将该数据传递到视图,并将视图渲染成请求的页面。通过模型读取的数据通常添加到数据结构(如列表或字典),这些数据是发送到视图的内容。
回到我们的Flask示例:
@app.route('/')
def main_page():
"""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)
现在,在视图函数中,我们从数据库中获取数据并执行一些基本逻辑。这将返回一个列表,我们分配给不同变量,该列表可在index.html模板中访问。
视图views
最后,在视图中,可以访问该数据结构,并且其中包含的信息将用于呈现用户最终在浏览器中看到的页面的HTML内容。
同样,回到我们的Flask应用程序,我们可以循环读取这些变量,并使用Jinja语法显示每个变量:
{% for entry in entries %}
<li>
<h2>{{ entry.title }}</h2>
<div>{{ entry.text|safe }}</div>
</li>
{% else %}
<li><em>No entries yet. Add some!</em></li>
{% endfor %}
总结
因此,MVC请求过程的更详细的技术摘要如下:
用户通过输入URL请求查看页面。
网页应用程序将URL与预定义的路由匹配。
调用与路由关联的控制器操作。
控制器使用模型从数据库中读取所有必要的数据,将数据放到列表或字典中,加载到视图,并按数据结构传递变量。
视图访问数据结构,并用它来渲染请求的页面,然后在其浏览器中向用户显示该页面。
这是亚历克斯·科尔曼(Alex Coleman)的客座帖子,他是一名编码讲师,并咨询了网络开发人员。
原文链接:用乐高解释模型-视图-控制器(MVC)框架 - 清心涟漪
作者:Alex Coleman
博主翻译后,对部分用语略有调整。