简单的注册登录功能

目录结构

  • login
      + www
          ajax.js
          user.html.js
      server.js

server.js:

const http=require('http');
const fs=require('fs');
const querystring=require('querystring');
const urlLib=require('url');

var users = {};//模拟数据,把接收到的东西放到这里

var server = http.createServer(function(req,res){
    //解析数据
    var str = '';
    req.on('data',function(data){
        str += data;
    })
    req.on('end',function(){
        var obj = urlLib.parse(req.url,true);
        const url = obj.pathname;
        const GET = obj.query;
        const POST = querystring.parse(str);

        
        //区分访问文件还是接口
        if(url == '/user'){  //接口
            switch(GET.act){
                case 'reg':
                  //1.检查用户名是否已经有了
                  if(users[GET.user]){
                    res.write('{"ok": false, "msg": "此用户已存在"}');
                  }else{
                    //2.插入users
                    users[GET.user]=GET.pass;
                    res.write('{"ok": true, "msg": "注册成功"}');
                  }
                  break;
                case 'login':
                //检查用户是否存在
                    if(users[GET.user] == null){
                        res.write('{"ok":false,"msg":"此用户不存在"}')
                    }else if(users[GET.user] != GET.pass){
                        //检查密码是否正确
                        res.write('{"ok":false,"msg":"用户名或密码错误"}')
                    }else{
                        res.write('{"ok":true,"msg":"登录成功"}')
                    }
                
                    break;
                default:
                    res.write('{"ok":false,"msg":"未知的act"}')    

            }
            res.end()

        }else{              //文件
            //读取文件
            var file_name = './www' + url;
            fs.readFile(file_name,function(err,data){
                if(err){
                    res.write('404')
                }else{
                    res.write(data)
                }
                res.end();
            })
        }
    })
})
server.listen(1377)

user.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>user</title>
    <script type="text/javascript" src="ajax.js"></script>
    <script type="text/javascript">
        window.onload = function(){
            var ouser = document.getElementById('user');
            var opass = document.getElementById('pwd');
            var regBtn = document.getElementById('regBtn');
            var loginBtn = document.getElementById('loginBtn');
            loginBtn.onclick = function(){
                ajax({
                    url: '/user',
                    data: {act: 'login',user:ouser.value,pass:opass.value},
                    type: 'get',
                    success:function(str){
                        var json = eval('(' + str + ')');
                        if(json.ok){
                            alert('登录成功')
                        }else{
                            alert('登录失败' + json.msg)
                        }
                    },
                    error: function(){
                        alert('通信失败')
                    }
                })

                


            }
            regBtn.onclick = function(){
                ajax({
                    url: '/user',
                    data: {act: 'reg',user:ouser.value,pass:opass.value},
                    type: 'get',
                    success:function(str){
                        var json = eval('(' + str + ')');
                        if(json.ok){
                            alert('注册成功')
                        }else{
                            alert('注册失败' + json.msg)
                        }
                    },
                    error: function(){
                        alert('通信失败')
                    }
                })
            }
        }
    </script>
</head>
<body>

    用户:<input type="text" id="user"><br>
    密码:<input type="password" id="pwd"><br>
    <input type="button" value="注册" id="regBtn">
    <input type="button" value="登录" id="loginBtn">

</body>
</html>
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容