NodeMCU作为网页服务器

借鉴这篇文章做了一个简单的服务程序。

程序总共5个文件：httpServer.lua，index.html，init.lua，spectre.css，zepto.js。

httpServer.lua是使用的这里的HTTP服务库，界面程序使用了轻量的Zepto.js与Spectre.css来搭建前端页面。其中Spectre.css删掉了大部分没有用到的功能。

首先是init文件的编写：
建立一个WiFi并打开HTTP服务

wifi.setmode(wifi.SOFTAP)
cfg = {}
cfg.ssid = "1004"
cfg.pwd = "10041004"
wifi.ap.config(cfg)
print(wifi.ap.getip())
-- Serving static files
dofile('httpServer.lua')
httpServer:listen(80)

处理对应的请求：

httpServer:use('/log', function(req, res)
    res:sendFile('1004.log')
end)    
-- 返回记录的登陆log信息
httpServer:use('/login', function(req, res)
    if req.query.name ~= nil and req.query.email ~= nil then
        print('Hello: ' .. req.query.name.. req.query.email)
        if file.open("1004.log", "a+") then
            file.write('Name :  '..req.query.name..'\n')
            file.write('Email:  '..req.query.email..'\n')
            file.write('---\n')
            file.close()
        end
--将提交的表单写入log保存
        print('LOG OK')
    else
        res:send('hello')
    end
end)

访问根目录返回的index.html如下：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>1004打卡</title>
    <link href="spectre.css" rel="stylesheet">
</head>
<body>
    <h1>签到</h1>
    <section class="section">
    <form>
        <div class="form-group">
            <label class="form-label" for="input-name">名字</label>
            <input id="name" class="form-input" id="input-name" placeholder="名字">
            <label class="form-label" for="input-email">邮箱</label>
            <input id="email" class="form-input" id="input-email" placeholder="邮箱">
        </div>
            <button type="button" id="connect" class="btn btn-primary float-right">提交</button>
    </form>
    </section>
    <script src="zepto.min.js"></script>
    <script>
        String.prototype.format = function() {
            var args = arguments;
            return this.replace(/\{(\d+)\}/g
                , function(m,i) {
                    return args[i];
            });
        }
        $(function() {
            $('#connect').click(function() {
                $.get('../login?name={0}&email={1}'.format($('#name').val(), $('#email').val()));
                alert('签到成功！')
            })
        })
    </script>
</body>
</html>

Screenshot_2017-05-15-18-18-55-260_com.android.br.png

Screenshot_2017-05-15-18-19-05-761_com.android.br.png

NodeMCU作为网页服务器

推荐阅读更多精彩内容