Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

OpenResty 初试 #54

Open
riskers opened this issue Jan 7, 2021 · 0 comments
Open

OpenResty 初试 #54

riskers opened this issue Jan 7, 2021 · 0 comments
Labels
tools 工具、小技巧

Comments

@riskers
Copy link
Owner

riskers commented Jan 7, 2021

可以理解 OpenResty = Nginx + Lua，可以用 Lua 扩展 Nginx

其中 OpenResty 官方提供了 Lua 组件，我这次使用了2个第三方组件:

背景

之前有个项目没有用前后端分离，整个项目都是 Java 的，前端代码会打包在 jar 包里。每次前端要发布，需要后端来发，这不合理！

所以，改造之。改造很顺利，使用的是 Nginx 方案:

在 CI 阶段，前端打包 -> 整个编译后的文件(HTML/CSS/JS) 全都放在 Docker 容器里 -> 容器就装一个 Nginx -> 搞定

到这里就结束了，但是，这个项目在 JSP 模板里，给前端注入了变量，如:

<html>
...
<script>
	var userInfo = <%USER_INFO%>
</script>
</html>

这个 <%USER_INFO%> 会被渲染成:

var userInfo = {
	"name": "riskers",
	"role": "admin"
}

本来没问题，但现在我们使用了 Nginx 来放置这个模板文件，就会出问题: 因为 Nginx 不会注入变量，用户访问这个页面就会出错: 因为 var userInfo = <%USER_INFO%> 这句会抛错。

这时候，就可以使用 OpenResty 解决问题

使用 OpenResty 解决问题

先安装 OpenResty, Mac 上直接使用 brew 安装:

brew install openresty

然后安装 lua 模块:

# 让 Nginx 拥有渲染模板能力的组件
luarocks install resty-template

# 让 Nginx 可以发送 HTTP 请求的组件
luarocks install lua-resty-http

这样改造流程变成了:

前端打包 -> 整个编译后的文件(HTML/CSS/JS) 全都放在 Docker 容器里 -> 容器就装一个 OpenResty -> 进入 index.html 前先调用 view.lua -> 搞定

至于 view.lua 干了两件事:

  1. 先调用 getUserInfo 接口，得到用户信息之后
  2. 再将用户信息注入在模板里

这样还没完，还要将其 Docker 化

Docker 化

Docker 化基本就是本机怎么做的，再在 Dockerfile 里再写一次

在调试 Nginx 配置的时候，一开始每改一部分，要 build 一次镜像，然后在前端编译过程中花很长时间，才能看到调试结果。后面我也有经验了: 在 Dockerfile 里写好要安装的软件后，就可以直接 exec 进去，直接改 Nginx 配置，然后重启，立刻看到效果。这可能也是我自己在 Docker 化时最大的省时间技巧了。

还有一个地方花了我一点时间，如何在两个 FROM 的基础镜像基础上交互，即把上一个镜像（Node）build 出来的 dist 文件夹 COPY 到这个镜像 (openresty) 里。AS 和 COPY --FROM 搭配起来就解决了:

FROM node:lts-alpine as builder

# ...

COPY --from=builder /app/dist /fe

总结

看起来可能很简单，可整个过程花了我2天时间，解决了:

  • OpenResty、Lua 以及 luarocks 安装
  • Lua 语言的适应
  • Nginx 配置的学习
  • resty-template 组件和 lua-resty-http 组件的学习
  • 开发 OpenResty 脚本时的调试
  • Docker 化的逐步调试

这也是我第一次如此较深入地去了解 OpenResty 并投入使用，完整代码在 https://github.com/riskers/openresty-demo

向我捐助 | 关于我 | 工作机会
@riskers riskers added the tools 工具、小技巧 label Jan 7, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
tools 工具、小技巧
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@riskers