node实现登录注册功能

FengNianya
  • 137

目标:

用node做服务器,实现登录注册功能,数据存储以txt文件格式存储在我的电脑里

E:/node_demo文件目录:

clipboard.png

代码:

  • login.html:
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>login</title>
</head>
<body>
  <div>
    <label for="user">用户名</label><input type="text" id="user">
  </div>
  <div>
    <label for="password">密   码</label><input type="password" id="password">
  </div>
  <div>
    <button id="login">登录</button>
    <button id="register"><a href="regist.html">注册</a></button>
  </div>
</body>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script>
  $(function () {
    $("#login").click(function () {
      if ($("#user").val().length == 0){
        return alert("请输入内容!");
      }
      if ($("#password").val().length == 0){
        return alert("请输入密码!");
      }

      $.ajax({
        url:"http://localhost:3000/login",
        type:"POST",
        data:{
          username:$("#user").val(),
          password:$("#password").val()
        },
        success:function (res) {
          alert("登录成功!")
        },
        error:function (err) {
          console.log(err);
        }
      })

    })
  });
</script>
</html>

  • regist.html:
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>regist</title>
</head>
<body>
  <div>
    <label for="user">用户名</label><input type="text" id="user">
  </div>
  <div>
    <label for="password">密   码</label><input type="password" id="password">
  </div>
  <div>
    <button id="register">注册</button>
  </div>
</body>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script>
  $(function () {
    $("#register").click(function () {
      $.ajax({
        url:"http://localhost:3000/register",
        type:"POST",
        data:{
          username:$("#user").val(),
          password:$("#password").val()
        },
        success:function (res) {
          alert(res);
        },
        error:function (err) {
          console.log(err);
        }
      })
    })
  });
</script>
</html>
  • serve.js:
var http = require("http");
var url = require("url");
var qs = require("querystring");
var fs = require("fs");

http.createServer(function (req , res) {
//设置请求头
  res.setHeader("Access-Control-Allow-Origin","*");
  if(req.method == "POST"){
    //接收发来的用户名和密码
    var result = "";
//获取前端代码发来的路由地址
    var pathName = url.parse(req.url).pathname;
    req.addListener("data",function (chunk) {
      result += chunk;
    });

    req.on("end" , function () {
      var user = qs.parse(result);
      //判断用户是否存在
      if(user.username){
        fs.readFile("db.txt" , "utf-8" , function (err,data) {
          if (!err){
            console.log("读取文件成功");
            if (!data){
              if(pathName == "/login"){
                res.end("该用户不存在");
                return;
              }
//根据前端发来的路由地址判断是登录还是注册页面,如果是注册页面
              if(pathName == "/register"){
//创建一个数组一个对象来保存帐号和密码
                var arr = [];
                var obj = {};
//把用户的帐号密码保存
                obj.username = user.username;
                obj.password = user.password;
                arr.push(obj);
//同步写入db.txt文件,必须是同步进行
                fs.writeFileSync("db.txt" , JSON.stringify(arr) , "utf-8");
                res.end("注册成功!");
                return;
              }
            }else {
              console.log("文件中有数据");
//把数据转成JSON对象,以便我们使用
              var arr = JSON.parse(data);
//遍历整个保存数据的数组 判断登录注册
              for(var i = 0;i < arr.length;i++){
                var obj = arr[i];
                if(obj.username == user.username){
                  if(pathName == "/login"){
                    if (obj.password == user.password){
                      res.end("登录成功!");
                      return;
                    }else {
                      res.end("密码错误!");
                      return;
                    }
                  }
                  if(pathName == "/register"){
                    res.end("该用户已存在!");
                    return;
                  }
                }
              }
              if(pathName == "/login"){
                res.end("用户名不存在!");
                return;
              }
              if(pathName == "/register"){
//创建新对象写入数据
                var obj = {};
                obj.username = user.username;
                obj.password = user.password;
                arr.push(obj);
                fs.writeFileSync("db.txt" , JSON.stringify(arr) , "utf-8");
                res.end("注册成功!");
                return;
              }
            }
          }else {
            console.log("读取文件失败");
          }
        })
      }
    });
  }else {
    res.end("get请求");
  }
}).listen(3000 , function (err) {
  if (!err){
    console.log("服务器启动成功,正在监听port3000...");
  }
});

node 启动serve,js:

clipboard.png

问题来了:

clipboard.png
为什么是这个???前端新手求助

回复
阅读 4k
2 个回答

你为什么不打印一下 req.method 呢?

这说明执行了 res.end("get请求");

没有做路由,建议你学习express等成熟框架。

如果像自己写,最好多看看例子

宣传栏