。

我们实战添加两个新的页面#xff0c;并讨论整个过程是如何串起来的。

添加一个新页面

web应用通常通过将HTTP方法和路径映射到应用的某个函数来处理请求。

Phoenix通过路由器来实现这个匹配。

例如将…本文的目的是讨论Phoenix请求的生命周期。

我们实战添加两个新的页面并讨论整个过程是如何串起来的。

添加一个新页面

web应用通常通过将HTTP方法和路径映射到应用的某个函数来处理请求。

Phoenix通过路由器来实现这个匹配。

例如将”/articles”映射到显示文章的函数。

因此添加一个页面首先要添加一个新的路由。

新建路由

控制器和动作通过路由器关联它要处理的HTTP方法和路径。

在Phoenix中控制器对应者Elixir的模块动作是控制器下定义的方法。

动作本质上就是一个处理请求的函数在Go语言中称为处理器函数Phoenix使用了”action”一词来表述它翻译为动作确实略显生硬阅读时可以理解为每个请求对应的动作。

但对于其本质一定要拿捏准确。

get

lib/hello_web/controllers/page_controller.ex

home/2

:put_secure_browser_headersendpipeline

:api

控制器是Elixir模块动作是模块下的Elixir函数。

动作的目的是收集数据并执行渲染。

我们需要一个

index/2

lib/hello_web/controllers/hello_controller.ex

defmodule

模板。

表示渲染的模块叫做视图Phoenix视图默认控制器和视图格式来命名这里控制器是

HelloController

输出的是完整的HTML页面。

为了快乐搬砖我们常常会用模板创建HTML页面。

让我们来创建一个视图新建

lib/hello_web/controllers/hello_html.ex

defmodule

:htmlend我们可以通过函数或者单独的文件向视图添加模板。

defmodule

标记内我们使用的模板语言叫HEEx表示”HTMLEEx”。

EEx是一个用来嵌入Elixir的库HTMLEEx是EEx针对HTML的扩展支持HTML验证组件和值的自动转义。

后者可使你免受跨站点脚本之类的安全漏洞的影响而无需额外的工作。

模板文件原理类似。

函数方式适用于短小的模板模板文件适用于有很多标签或当你感觉函数已难以维护时。

def

lib/hello_web/controllers/hello_html

注意看控制器名称

NAME.FORMAT.TEMPLATING_LANGUAGE

我们在

lib/hello_web/controllers/hello_html/

目录下创建一个名为

/section模板文件会自行编译为模块下的函数两种方式没有运行时的性能差异。

这里有些有趣的事情值得我们注意。

当我们做这些变更时不需要停止和重启服务器。

没错Phoenix具有代码热加载还有即使我们的

index.html.heex

标签我们也得到了一个完整的HTML文档。

事实上我们的模板是渲染在一个布局中的首先渲染的是

lib/hello_web/components/layouts/root.html.heex

然后它会渲染

lib/hello_web/components/layouts/app.html.heex

最后是我们的内容。

如果你打开这些文件看一看就会在底部发现这样一行代码

inner_content

%它会在HTML被发送到浏览器之前将模板注入到布局中。

关于布局我们会在后面的教程中介绍。

从endpoint到视图

我们已经创建了第一个页面现在可以看看一个请求的生命周期是如何串联起来的了。

HelloWeb.Endpoint

跟路由挺像的。

Plug是一个库也是组织web应用的说明书。

它是Phoenix处理请求的重要部分有关细节后面的教程中会讲到。

目前可以说每个plug都定义了一个处理请求的队列。

在endpoint中你会看到大致如下的框架

defmodule

end每个插件都有不同的作用后面我们会讲到。

最后一个插件恰好就是

HelloWeb.Router

模块。

它让endpoint将所有请求的后续处理都交给路由器。

路由器的主要作用就是将请求映射到处理器。

最后处理器告诉视图渲染一个模板。

此时你可能会想简单地渲染一个页面怎么需要这么多步骤。

但是当应用变得越来越复杂时我们会看到每一层都有其特殊的作用

endpoint包含所有请求的公共和初始路径用来处理所有请求都要做的事情。

路由器(Phoenix.Router)

路由负责将请求分发到控制器同时也运行我们确定一些功能的范围。

比如有些页面需要用户鉴权有些页面则不需要。

控制器(Phoenix.Controller)

控制器的工作是提取请求信息调用业务领域并为表示层准备数据。

视图

视图处理来自控制器的结构化数据并将其转换为显示给用户的形式。

视图通常以它们呈现的内容格式命名。

这里我保留了endpoint这个单词本意为端点、终点直译不好理解这里endpoint指的其实就是服务端或者说是服务所有请求的入口点。

创建新页面

让我们稍微加一点难度添加一个页面它会截取URL的一部分并通过控制器传入模板最后在页面上显示出来。

创建新路由

语法Phoenix会将URL中对应位置的值转成一个变量。

例如我们在浏览器输入

http://localhost:4000/hello/Frank

新建动作

lib/hello_web/controllers/hello_controller.ex

show

函数。

这一次我们需要从参数中提取messenger变量并传递给模板。

为此将下面的函数添加到控制器

def

如果我们需要访问除messenger之外的请求参数可以像下面这样定义

show/2

lib/hello_web/controllers/hello_html

目录下命名为

来求值Elixir表达式。

任何出现在标签内的Elixir代码都会被执行其结果会替换该标签。

如果标签内没有等号代码依然会被执行但结果不会出现在页面中。

记住我们的模板是用HEEx(HTMLEEx)编写的HEEx是EEx的超集因此也继承了

模板内容如下

/section我们从控制器传入视图的值统称为”assigns”我们可以通过

assigns.messenger

来访问messenger但是通过元编程Phoenix为我们提供了更加干净的

http://localhost:4000/hello/Frank