第二天 - 自动重载以实现快速开发

使用 Mojolicious 开发 Web 应用程序非常有趣!使用 morbo 服务器进行开发,对我的 webapp 的每次更改都会导致重新启动以加载我的更改。这样我下一个请求就有了我的新代码!

所以,我改变了我的代码,重新启动了 webapp,然后我回到浏览器窗口。等等……我的新代码在哪里?为什么不修复错误?没有…我忘记重新加载我的浏览器窗口了吗?啊!当然!

这是否发生在你身上?可能不是。但是,在每次后端代码更改后重新加载浏览器窗口仍然很烦人。如果每次重新启动 Web 服务器时我的浏览器窗口都会自动重新加载,那就太好了!

AutoReload 插件

像 Perl 中的每个问题一样,有一个 CPAN 模块:Mojolicious::Plugin::AutoReload。将此插件添加到我们的应用程序将自动重新加载连接到我们的应用程序的任何浏览器窗口,使开发 Mojolicious 应用程序更容易!

要使用该插件,我们使用 plugin 方法将其添加到我们的应用程序中。然后,我们将 auto_reload 帮助器添加到布局模板中:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
use Mojolicious::Lite;

plugin 'AutoReload';
get '/' => 'index';

app->start;
__DATA__

@@ layouts/default.html.ep
%= auto_reload
%= content

@@ index.html.ep
% layout 'default';
<h1>Hello, World!</h1>

在这里下载代码。现在,当我们在浏览器中打开应用程序时,如果服务器重新启动,我们的浏览器将重新加载页面以查看新应用程序!

工作原理

这个插件简单优雅:当浏览器加载页面时,它连接到位于 /auto_reload 的 WebSocket。服务器重新启动时,WebSocket 连接中断。客户端看到断开的连接,等待服务器再次开始侦听连接,然后重新加载页面。

在生产中禁用

一旦我们从 morbo 切换到 hypnotoad,我们就不再需要自动重新加载了。因此,插件不会向浏览器发送 JavaScript 来构建 websocket。这是使用 mode 属性控制的。当 modedevelopment 模式(morbo 的默认模式)时,将告知浏览器创建 WebSocket。当 mode 为其他任何模式时,不会创建 WebSocket。

让 Mojolicious 变得如此有趣的部分原因在于它是多么容易。整个插件只有40行代码

现在,使用 Mojolicious::Plugin::AutoReload,在 Mojolicious 开发时只是更容易一点,而且更有趣!