Lua模版渲染 · Nginx+Lua OpenResty 開發

# 模版渲染動態web網頁開發是Web開發中一個常見的場景，比如像京東商品詳情頁，其頁面邏輯是非常復雜的，需要使用模板技術來實現。而Lua中也有許多模板引擎，如目前京東在使用的[lua-resty-template](https://github.com/bungle/lua-resty-template)，可以渲染很復雜的頁面，借助LuaJIT其性能也是可以接受的。 如果學習過JavaEE中的servlet和JSP的話，應該知道JSP模板最終會被翻譯成Servlet來執行；而lua-resty-template模板引擎可以認為是JSP，其最終會被翻譯成Lua代碼，然后通過ngx.print輸出。 而lua-resty-template和大多數模板引擎是類似的，大體內容有：模板位置：從哪里查找模板；變量輸出/轉義：變量值輸出；代碼片段：執行代碼片段，完成如if/else、for等復雜邏輯，調用對象函數/方法；注釋：解釋代碼片段含義； include：包含另一個模板片段；其他：lua-resty-template還提供了不需要解析片段、簡單布局、可復用的代碼塊、宏指令等支持。 ## 下載lua-resty-template ``` wget https://github.com/bungle/lua-resty-template/archive/v1.9.tar.gz tar -xvzf v1.9.tar.gz ``` 解壓后可以看到lib/resty下面有一個template.lua，這個就是我們所需要的，在template目錄中還有兩個lua文件，將這兩個文件復制到/usr/openResty/lualib/resty中即可。接下來就可以通過如下代碼片段引用了： ``` local?template?=?require("resty.template") ``` ## 模版位置我們需要告訴lua-resty-template去哪兒加載我們的模塊，此處可以通過set指令定義template_location、template_root或者從root指令定義的位置加載。我們可以在openResty.conf配置文件的server部分定義 ``` # first match ngx location set $template_location "/templates"; # then match root read file set $template_root "/usr/openResty/templates"; ``` 也可以通過在server部分定義root指令 ``` root /usr/openResty/templates; ``` 其順序是 ``` local function load_ngx(path) local file, location = path, ngx_var.template_location if file:sub(1) == "/" then file = file:sub(2) end if location and location ~= "" then if location:sub(-1) == "/" then location = location:sub(1, -2) end local res = ngx_capture(location .. '/' .. file) if res.status == 200 then return res.body end end local root = ngx_var.template_root or ngx_var.document_root if root:sub(-1) == "/" then root = root:sub(1, -2) end return read_file(root .. "/" .. file) or path end ``` 1. 通過ngx.location.capture從template_location查找，如果找到（狀態為為200）則使用該內容作為模板；此種方式是一種動態獲取模板方式； 2. 如果定義了template_root，則從該位置通過讀取文件的方式加載模板； 3. 如果沒有定義template_root，則默認從root指令定義的document_root處加載模板。 此處建議首先template_root，如果實在有問題再使用template_location，盡量不要通過root指令定義的document_root加載，因為其本身的含義不是給本模板引擎使用的。 接下來定義模板位置 ``` mkdir?/usr/openResty/templates mkdir?/usr/openResty/templates2 ``` ## openResty.conf配置文件 ``` # first match ngx location set $template_location "/templates"; # then match root read file set $template_root "/usr/openResty/templates"; location /templates { internal; alias /usr/openResty/templates2; } ``` 首先查找/usr/openResty/template2，找不到會查找/usr/openResty/templates。然后創建兩個模板文件 ``` vi?/usr/openResty/templates2/t1.html ``` 內容為 ``` template2 ``` ``` vi?/usr/example/templates/t1.html ``` 內容為 ``` template1 ``` ## test_temlate_1.lua ``` local template = require("resty.template") template.render("t1.html") ``` ## openResty.conf配置文件 ``` location /lua_template_1 { default_type 'text/html'; lua_code_cache on; content_by_lua_file /usr/openResty/lua/test_template_1.lua; } ``` 訪問如http://127.0.0.1/lua_template_1將看到template2輸出。然后rm /usr/openResty/templates2/t1.html，reload nginx將看到template1輸出。接下來的測試我們會把模板文件都放到/usr/openResty/templates下。 # API 使用模板引擎目的就是輸出響應內容；主要用法兩種：直接通過ngx.print輸出或者得到模板渲染之后的內容按照想要的規則輸出。 ## test_template_2.lua ``` local template = require("resty.template") --是否緩存解析后的模板，默認true template.caching(true) --渲染模板需要的上下文(數據) local context = {title = "title"} --渲染模板 template.render("t1.html", context) ngx.say(" ") --編譯得到一個lua函數 local func = template.compile("t1.html") --執行函數，得到渲染之后的內容 local content = func(context) --通過ngx API輸出 ngx.say(content) ``` 常見用法即如下兩種方式：要么直接將模板內容直接作為響應輸出，要么得到渲染后的內容然后按照想要的規則輸出。 ## openResty.conf配置文件 ``` location /lua_template_2 { default_type 'text/html'; lua_code_cache on; content_by_lua_file /usr/openResty/lua/test_template_2.lua; } ``` # 使用示例 ## test_template_3.lua ``` local template = require("resty.template") local context = { title = "測試", name = "張三", description = "<script>alert(1);</script>", age = 20, hobby = {"電影", "音樂", "閱讀"}, score = {語文 = 90, 數學 = 80, 英語 = 70}, score2 = { {name = "語文", score = 90}, {name = "數學", score = 80}, {name = "英語", score = 70}, } } template.render("t3.html", context) ``` ## 模板文件/usr/openResty/templates/t3.html ``` <html> <head> <meta charset="UTF-8" /> </head> <body> {# 不轉義變量輸出 #} 姓名：{* string.upper(name) *} {# 轉義變量輸出 #} 簡介：{{description}} {# 可以做一些運算 #} 年齡: {* age + 1 *} {# 循環輸出 #} 愛好： {% for i, v in ipairs(hobby) do %} {% if i > 1 then %}，{% end %} {* v *} {% end %} 成績： {% local i = 1; %} {% for k, v in pairs(score) do %} {% if i > 1 then %}，{% end %} {* k *} = {* v *} {% i = i + 1 %} {% end %} 成績2： {% for i = 1, #score2 do local t = score2[i] %} {% if i > 1 then %}，{% end %} {* t.name *} = {* t.score *} {% end %} {# 中間內容不解析 #} {-raw-}{(file)}{-raw-} </body> </html> ``` {(include_file)}：包含另一個模板文件； {* var *}：變量輸出； {{ var }}：變量轉義輸出； {% code %}：代碼片段； {# comment #}：注釋； {-raw-}：中間的內容不會解析，作為純文本輸出；模板最終被轉換為Lua代碼進行執行，所以模板中可以執行任意Lua代碼。 ## openResty.conf配置文件 ``` location /lua_template_3 { default_type 'text/html'; lua_code_cache on; content_by_lua_file /usr/openResty/lua/test_template_3.lua; } ``` 訪問如http://127.0.0.1/lua_template_3進行測試。基本的模板引擎使用到此就介紹完了。