2018-12-06 node.js--第五天

\color{red}{express-static}

const express=require('express');
const expressStatic=require('express-static');
var server=express();
server.listen(8080);
server.use(expressStatic('./www'))
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body>
        <form action="http://localhost:8080" method="get">
            <p>用户名: <input type="text" name="uname"></p>
            <p>密码: <input type="text" name="upwd"></p>
            <p><input type="submit" value="提交"></p>
        </form>
    </body>
</html>
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body>
        <p>NCKLSDJGL</p>
    </body>
</html>

const express=require('express');
const expressStatic=require('express-static');
var server=express();
server.listen(8080);
server.use('/',function(req,res){
    console.log(req.query);//解析get发送的数据请求
})
server.use(expressStatic('./www'));

验证

//127.0.0.1:8080/login?uname=xxx&upwd=123    get 响应对象
//{
//  "ok":true/false,
//  "msg":用户名不存在
//}
//1.创建服务
const express=require('express');
//2.创建静态文件目录
const expressStatic=require('express-static');
var server=express();
server.listen(8080);
//4.模拟数据
var users={
    "blue":'123',
    "jack":'456',
    "tom":'789'
};

//3.处理用户请求
server.use('/login',function(req,res){
    //req.query  {uname:jack,upwd:123}
    console.log(req.query); //{uname:jack,upwd:123}
    //获取表单中的用户名和密码
    var user=req.query['uname'];
    //console.log(user)
    var upwd=req.query['upwd'];
    //console.log(upwd);
    if(users[user]==null){
        console.log(users[user]); //jack
        res.send({'ok':false,'msg':'用户名不存在'})
    }else if(users[user]!=upwd){
        res.send({'ok':false,'msg':'密码错误'})
    }else{
        res.send({'ok':true,'msg':'登陆成功'})
    }
})
server.use(expressStatic('./www'));

\color{red}{form.html}

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body>
        <p>用户名: <input type="" name="uname" id='uname'></p>
        <p>密码: <input type="" name="upwd" id='upwd'></p>
        <p><input type="button" value='登录' id='btn'></p>
        <script src="js/jquery.js"></script>
        <script>
            var uname=document.getElementById('uname');
            //console.log(unameVal);
            var upwd=document.getElementById('upwd');
            //console.log(upwdVal);
            //var btn=document.getElementById('btn');
            
            $('#btn').click(function(){
                $.ajax({
                    type:'get',
                    url:'/login',
                    data:{'uname':uname.value,'upwd':upwd.value},
                    success:function(list){
                        //console.log(list);
                        if(list.ok==true){
                            console.log(list);
                            alert('登陆成功');
                        }else{
                            alert('登录失败');
                        }
                    }
                })
            })
        </script>
    </body>
</html>

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容