如何在 localhost3000 上运行 html 文件？答案

【问题标题】：How to run html file on localhost3000?如何在 localhost3000 上运行 html 文件？
【发布时间】：2022-12-04 23:52:57
【问题描述】：

我将所有 .js 文件和 html 链接到我的服务器文件。但是当我在 localhost3000 上吃午饭时，我得到“无法获取/”

我尝试了所有可能有用但无法解决问题的方法。任何人都知道如何解决它？

我的服务器端有这个

const express = require('express');
const app = express();
app.listen(3000, () => console.log('listening at port 3000!'));

app.use(express.static('codefreeze.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">
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
    <script src="codefreeze.js"></script>
    <link rel="stylesheet" href="codefreeze.css">
    <link href = "https://fonts.googleapis.com/css?family=Schoolbell&v1" rel="stylesheet">
    <title>DIARY</title>
</head>
<body onload="Name()">
    <h1>HELLO!</h1>
    <p>Welcome <span id="name"></span></p>
    <p id="date"></p>

    <script>
        document.getElementById("date").innerHTML = DATE();
    </script>

    <div id="user">

        <label id="lbl1">Passage #1</label><br>
        <textarea id="psg1" rows="10" cols="30"></textarea><br>

    </div>

    <button id="save" onclick="save()">SAVE</button>
    <button id="add" onclick="add()">ADD</button>
    <button id="delete" onclick="del()">DELETE</button>

</body>
</html>

我知道我正在做的事情是错误的，但我似乎无法找到什么。

【问题讨论】：

标签： javascript html

【解决方案1】：

看起来您正在尝试使用 express.static() 中间件提供 codefreeze.html 文件，但未正确使用此中间件。

express.static() 中间件用于从指定目录提供静态文件，例如图像、CSS 和 JavaScript 文件。它不直接提供 HTML 文件，因此您需要使用不同的方法来提供 codefreeze.html 文件。

要解决此问题，您可以使用 app.get() 方法定义一个路由，当 GET 请求发送到根 URL (/) 时，该路由将为 codefreeze.html 文件提供服务。此方法有两个参数：路由的路径（在本例中为 /）和路由匹配时将调用的回调函数。

以下是如何使用 app.get() 方法为 codefreeze.html 文件提供服务的示例：

const express = require("express");
const app = express();

app.listen(3000, () => console.log("listening at port 3000!"));

// Define a route that will serve the codefreeze.html file
app.get("/", (request, response) => {
  // Use the response.sendFile() method to send the codefreeze.html file
  response.sendFile(__dirname + "/codefreeze.html");
});

【讨论】：