使用 Node.js 和 Express.js 从 REST API 加载单页面应用程序的所有资源时出现问题

问题描述 投票:0回答:2

我正在尝试在node.js + express.js 中运行此单页应用程序,但我只能加载html 文件,而不能加载所需的2 个JavaScript 文件。

天气.js

const { Router } = require("express");
const controller = require("./controller");
const path = require("path");

const router = new Router();

router.get("/home", (req, res) => {
  res.sendFile(path.join(__dirname, "public", "home.html"));
});

router.post(
  "/district/",
  [controller.auther, controller.admin],
  controller.addDistrict
);
router.post(
  "/data/",
  [controller.auther, controller.editor],
  controller.addData
);
router.get("/", [controller.auther, controller.viewer], controller.getData);
router.post("/auth", controller.auth);

module.exports = router;

服务器.js

const express = require("express");
const weatherRoutes = require("./src/weather");
const path = require("path");

const app = express();
const port = 3000;

app.use(express.json());

app.use(express.static(path.join(__dirname, "public")));

app.use("/api/weather", weatherRoutes);

app.listen(port, () => console.log(`App listening on port ${port}`));

home.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Hello World</title>
  </head>
  <body>
    <div id="map"></div>
    <script type="text/javascript" src="countrymap.js"></script>
    <script type="text/javascript" src="mapdata.js"></script>
  </body>
</html>

尝试更改js文件的文件位置。

node.js express rest single-page-application
2个回答
0
投票

尝试将 基本标签 添加到

home.html

  <base href="/" target="_blank">

<base>
HTML 元素指定基本 URL 用于文档中的所有relative URL。只能有 文档中的一个
<base>
元素。

<!DOCTYPE html>
<html lang="en">
  <head>

    <base href="/" target="_blank">
    
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Hello World</title>
  </head>
  <body>
    <div id="map"></div>
    <script type="text/javascript" src="countrymap.js"></script>
    <script type="text/javascript" src="mapdata.js"></script>
  </body>
</html>

0
投票
  • 将公用文件夹移出 src
  • 删除了与托管 SPA 相关的所有代码
  • 将此代码添加到 server.js
    app.use(express.static("public"));
  • 将 home.html 更改为index.html
  • 工作在http://localhost:3000/
© www.soinside.com 2019 - 2024. All rights reserved.