node实现登录注册功能

开始之前 再vscode中中引入相应的包结构`

npm i mysql

建一个index.js

const http = require('http');
const fs = require("fs");
const mysql = require("mysql");

http.createServer(function (req, res) {
  res.writeHead(200, {
    'Content-Type': 'text/html;charset=utf-8'
  });
  if (req.url == "/favicon.ico") {
    res.end("");
    return;
  } else if (req.url == "/") {
    //显示 页面
    fs.readFile("register.html", "utf-8", (err, data) => {
      if (err) {
        res.end(JSON.stringify(err));
        return;
      }
      res.end(data);
    })
  } else if (req.url == "/register") {
    //获取传递过来的参数
    let data = "";

    req.on("data", (chunk) => {
      data += chunk;
    })
    req.on("end", () => {
      let params = new URLSearchParams(data);
      //执行 注册
      const conn = mysql.createConnection({
        host: "localhost",
        database: "py",
        user: "root",
        password: "123456"
      })
      //连接
      conn.connect();
      //准备sql语句
      let sql = `insert into user (name,pwd) values ('${params.get("username")}','${params.get("pwd")}')`;

      conn.query(sql,(err,data)=>{
        if (err) {
          res.end("服务器内部错误!");
          console.log(err);
          return;
        }
        if (data.affectedRows > 0) {
          res.end("注册成功!")
        }else{
          res.end("注册失败!")
        }
      })

    })

  }
}).listen(8081);

console.log('Server running at http://127.0.0.1:8081/');

准备一个页面register.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>注册</title>
</head>
<body>
  <form action="http://127.0.0.1:8081/register" method="post">
    用户名:<input type="text" name="username"><br>
    密码:<input type="password" name="pwd" ><br>
    确认密码:<input type="password" name="conpwd"><br>
    <input type="submit" value="注册" id="btn">
    <input type="reset" value="清空">
  </form>
  <script>
    //获取密码元素节点
    let pwd = document.querySelector("input[name='pwd']");
    //获取确认密码元素节点
    let conpwd = document.querySelector("input[name='conpwd']");
    //获取注册按钮元素节点
    let btn = document.getElementById('btn');

    btn.onclick = function () {
      //判断密码与确认密码是否相等。
      if(pwd.value.trim() != conpwd.value.trim()){
        alert("两次输入的密码不一致!")
        return false;
      }
    }
  </script>
</body>
</html>

运行

npm index.js

实现效果

在这里插入图片描述

登录只需要改变 index.js 中 sql 后面的代码

  //准备sql语句
      let sql = `insert into user (name,pwd) values ('${params.get("username")}','${params.get("pwd")}')`;

      conn.query(sql,(err,data)=>{
        if (err) {
          res.end("服务器内部错误!");
          console.log(err);
          return;
        }
        if (data.affectedRows > 0) {
          res.end("注册成功!")
        }else{
          res.end("注册失败!")
        }
      })

    })

  }
}).listen(8081);

版权声明:本文为weixin_48864616原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。