Disk-demo-index-jk NPM

登录注册

     后台代码
    const http = require("http");
    const fs = require("fs");
    const path = require("path");
    const url = require("url");

    const static = "public";
    const login = "login.html";
    // const data = [{
    //     user: "张三",
    //     pwd: '123'
    // }, {
    //     user: "李四",
    //     pwd: '444'
    // }];
    http.createServer((req, res) => {
        //获取路径
        let pathname = url.parse(req.url).pathname;

        //判断是否为根路径
        if (pathname === "/") {
            pathname = login;
        }

        // console.log(pathname)
        if (path.extname(pathname)) {
            // console.log(111)
            //静态资源
            res.end(fs.readFileSync(path.join(static, pathname)));
        } else {
            // console.log(111)
            //非静态资源
            //判断请求是GET还是POST
            if (req.method === "GET" && pathname === "/api/login") {
                //是get那就先解构  将路径转换为标准路径
                let {
                    user,
                    pwd
                } = url.parse(req.url, true).query;
                if (user === "hop" && pwd === "123") {
                    res.end('1');
                } else {
                    res.end("0");
                }
            }
            // console.log(111)
            if (req.method === "POST" && pathname === "/api/login") {
                //定义一个字符串容器
                let body = '';
                //数据进行传输
                req.on("data", chunk => {
                    body += chunk;
                });
                req.on("end", () => {
                    //传输结束  转换为JSON字符串类型
                    let {
                        user,
                        pwd
                    } = JSON.parse(body); //转换json型字符串
                    // console.log(body);
                    let data = require("./data.json");
                    // let flag = data.filter(item =>
                    //     item.user === user && item.pwd === pwd
                    // )
                    // console.log(user, pwd);
                    // console.log(flag);
                    let flag = data.some(item => item.user === user && item.pwd === pwd);
                    if (flag) {
                        res.end("1");
                    } else {
                        res.end("0");
                    }
                })
            }

            //注册
            if (req.method === "POST" && pathname === "/api/register") {
                //定义一个字符串容器
                let body = '';
                //数据进行传输
                req.on("data", chunk => {
                    body += chunk;
                });
                req.on("end", () => {
                    //传输结束  转换为JSON字符串类型
                    let {
                        user,
                        pwd
                    } = JSON.parse(body); //转换json型字符串
                    // console.log(body);


                    let data = require("./data.json");
                    // let flag = data.filter(item =>
                    //     item.user === user && item.pwd === pwd
                    // )
                    // console.log(user, pwd);
                    // console.log(flag);
                    let flag = data.some(item => item.user === user);

                    if (!user || !pwd) {
                        flag = true;
                    }

                    if (flag) {
                        res.end("0");
                    } else {
                        data.push(JSON.parse(body));
                        fs.writeFileSync("data.json", JSON.stringify(data));
                        res.end("1");
                    }
                })
            }
        }
    }).listen("8080", () => console.log("服务器正在运行中...."));

    前端代码
    <!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./css/index.css">
    <title>Document</title>
</head>

<body>
    <form>
        <h2>首页登录注册</h2>
        <input type="text" placeholder="请输入账户" class="user">
        <input type="password" placeholder="请输入密码" class="pwd">
        <button class="btn" type="button">登录</button>
        <button class="register" type="button"> 注册</button>
    </form>
</body>
<script src="./js/axios.js"></script>
<script>
    let user = document.querySelector(".user"),
        pwd = document.querySelector(".pwd"),
        btn = document.querySelector(".btn"),
        registers = document.querySelector(".register");

    function logins() {
        //发送请求要用ajax
        console.log(45)
        axios.post("/api/login", {
            user: user.value,
            pwd: pwd.value,
        }).then((result) => {
            // console.log(result);
            if (result.data) {
                alert('登录成功');
            } else {
                alert("登录失败");
            }
        })
    }

    // 注册
    function register() {
        //发送请求要用ajax
        console.log(45)
        axios.post("/api/register", {
            user: user.value,
            pwd: pwd.value,
        }).then((result) => {
            // console.log(result);
            if (result.data) {
                alert('注册成功');
            } else {
                alert("注册失败，请重新注册");
            }
        })
    }

    
    btn.addEventListener("click", logins);
    registers.addEventListener("click", register);
</script>

</html>
axios
@infinitebrahmanuniverse/nolb-disk @everything-registry/sub-chunk-1487 @zalastax/nolb-disk
1.0.0
3 years ago
登录 注册

登录注册
