如何呈现 HTML 页面表单 NodeJs API？答案

【问题标题】：How to render a HTML page form NodeJs API?如何呈现 HTML 页面表单 NodeJs API？
【发布时间】：2019-01-28 18:26:29
【问题描述】：

**运行 http-server 后，我尝试访问 URL-http://127.0.0.1:8080-但我得到的不是我写的 “Node.js v8.11.4/ecstatic server running @ 127.0.0.1:8080”` 每次我尝试。

但 index.html 文件在直接从按钮单击时会打开，将 chrome 显示为默认浏览器，并且在编码中所做的任何更改（例如添加电子邮件、密码或更改背景颜色）都会相应地捕获。我该如何解决这个问题？？**

这里是 index.html 的代码-

<!DOCTYPE html>
<html>
    <head>
            <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
            <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha256-3edrmyuQ0w65f8gfBsqowzjJe2iM6n0nKciPUp8y+7E=" crossorigin="anonymous"></script>
            <link rel="stylesheet" href="css/style.css" />
            <script src="https://www.gstatic.com/firebasejs/5.4.0/firebase.js"></script>
    </head>

    <body class="bg-dark">

        <div id="login-card" class="card">
            <div class="card-body">
                <h1> Wallpaper App Admin </h1>

                <form id="login-form">
                    <div class="form-group">
                        <label for="email">Email</label>
                        <input type="email" id="email" class="form-control" />
                    </div>
                    <div class="form-group">
                            <label for="password">Password</label>
                            <input type="password" id="password" class="form-control" />
                        </div>
                        <div class="form-group">
                            <button id="btn-login" type="button" class="btn btn-primary">Login</button>
                        </div>
                </form>
            </div>
        </div>
        <script src="js/app.js"></script>

        <script>

            firebase.auth().onAuthStateChanged(function(user){
                if(user){
                    window.location.href = "admin.html";
                }
            });

        </script>

        </body>
</html>

【问题讨论】：

你能展示一些你的代码吗？就像您创建的路由器或主服务器脚本一样？（您的 app.get('/',...) 映射等）
您能回复我的问题并表现出兴趣，真是太好了。实际上我不能在这里发布任何图片，因为他们说我需要至少 10 个声誉才能在这里发布图片。我已附上问题中的链接，请浏览它们。
imgur.com/yOzfwQe 和 imgur.com/aPG9N0d
没问题，但我需要您编辑您的问题并添加您的代码。无需将该代码作为图像发布，您可以将其复制并粘贴为纯文本。请记住，堆栈溢出要求代码以四个前导空格缩进（使用 vs code、gedit 或 notepad++ 等工具来帮助您）。

标签： javascript node.js http server ecstatic

【解决方案1】：

在我看来，您无法找到响应您的 HTML 页面的端点。每个 url 都是一个向服务器发出请求的 API。我们在浏览器上输入的 url 是 GET API。

您的http://localhost:8080 和http://127.0.0.1:8080 是端点为/ 的API。

如果您使用的是 expressJs，那么请查找以下内容：

app.get('/yourAPI/', (req, res) => {
    //res.render is function that send html page to browser
    res.render('htmlFile');
});
// So your page will be available on http:127.0.0.1:8080/yourAPI
// or http://localhost:8080/yourAPI

请注意，您的函数应该是 app.get()，因为您无法从浏览器调用 app.post。

您需要找出响应 HTML 页面的端点。

【讨论】：