重定向到 node.js 中的另一个 HTML 文件,并且 HTML 不起作用

Redirect to another HTML file in node.js and HTML is not working

提问人:Afzal 提问时间:11/12/2023 最后编辑:RobotnikAfzal 更新时间:11/15/2023 访问量:33

问:

当我单击“登录”按钮时,登录opti_2.html:

<form id="loginform" onsubmit="submitForm(event)" method="post">
                <div class="input-box">
                    <input type="text" name = "uemail" class="input-field" placeholder="Username or Email">
                    <i class="bx bx-user"></i>
                </div>
                <div class="input-box">
                    <input type="password" name = "upass" class="input-field" placeholder="Password">
                    <i class="bx bx-lock-alt"></i>
                </div>
                <div class="input-box">
                    <input type="submit" class="submit" value="Sign In">
                </div>
            </form>

打开图片

我想打开另一个html文件 - register.html(只是一个例子):

<html> 
<head> 
    <title>
    Registers
</title>
</head>  

<body> 
    <form action="/" method ="post">
        Name: 
        <input type ="text" name = "uname" placeholder="text"> <br>
        Email ID:
        <input type="email" name = "uemail" placeholder="email"><br>
        Address: 
        <input type="text" name = "uaddress" placeholder="text"><br>
        Phone No: 
        <input type="text" name = "uphone" placeholder="number"><br>
        Password: 
        <input type="text" name = "upass" placeholder="password"><br>
        <input type="submit"> 
    </form>
</body>
</html>

这是我使用的逻辑:

<script>
    var a = document.getElementById("loginBtn");
    var b = document.getElementById("registerBtn");
    var x = document.getElementById("login");
    var y = document.getElementById("register");

function login() {
    // Redirect to register.html
    window.location.href = 'register.html'; // Change this line to the correct URL
}

function register() {
    x.style.left = "-510px";
    y.style.right = "5px";
    a.className = "btn";
    b.className += " white-btn";
    x.style.opacity = 0;
    y.style.opacity = 1;
}

</script>

我正在使用 XAMPP 来托管此服务器,我的 Node.js 代码是:

显示图像

const http = require("http");
const mysql = require("mysql");
const qs = require("querystring");
const fs = require("fs");

const pool = mysql.createPool({
    connectionLimit: 10,
    host: "localhost",
    user: "root",
    password: "",
    database: "optiverse",
    port: 3307,
});

const server = http.createServer((req, res) => {
    if (req.method === 'GET') {
        res.writeHead(200, { "Content-Type": "text/html" });
        fs.createReadStream("opti_2.html").pipe(res);
    } else if (req.method === 'POST') {
        var formdata = "";
        req.on("data", (chunk) => {
            formdata += chunk;
        });

        req.on("end", () => {
            const data = qs.parse(formdata);

            // Use a prepared statement to avoid SQL injection
            const query = "SELECT * FROM users WHERE email = ? AND password = ?";
            const values = [data.uemail, data.upass]; // Note: This is not secure for production

            pool.getConnection((err, connection) => {
                if (err) throw err;

                connection.query(query, values, (err, result) => {
                    connection.release(); // Release the connection back to the pool

                    if (err) throw err;

                    if (result.length > 0) {
                        console.log("User is registered");
                        // Redirect to another HTML file (e.g., register.html)
                        res.writeHead(302, { "Location": "register.html" });
                        res.end();
                    } else {
                        console.log("User is not registered");
                        res.writeHead(200, { "Content-Type": "text/plain" });
                        res.end("User is not registered");
                    }
                });
            });
        });
    }
});

server.listen(1200, () => {
    console.log("Server is listening on port 1200");
});

当我opti_3.js运行此节点并尝试使用数据库中已有的凭据登录时,URL 会像这样附加

我尝试从 ChatGPT 获得帮助,但它不起作用,URL 只是被附加了,仅此而已。 我只希望在单击登录页面时打开 register.html 文件。

javascript html css 节点 .js xampp

评论

0赞 jfriend00 11/12/2023
我希望你意识到你的使用不是正确的错误处理。您必须对每个请求发送响应。收到错误时,发送错误响应。不要盲目地一无所获。if (err) throw err;
0赞 jfriend00 11/12/2023
您是否了解发送带有位置标头的 302 响应将告诉客户端向该新位置发送新的 http 请求以获取应用作响应的内容?因此,当客户尝试转到 时,这正是您的 302 响应告诉它要做的。你还没有对你的服务器进行编码,以便在客户端请求时做任何独特的事情,所以也许这就是你感到困惑的原因。localhost:12000/register.html/register.html

答: 暂无答案