时间戳

首页 > 解决方案 > 登陆页面不断以快递形式返回静态文件

javascript - 登陆页面不断以快递形式返回静态文件

问题描述

我正在尝试在我的项目中使用静态文件，但是当用户向我的“/”登录页面发出获取请求时。我想发送非静态的东西，比如 json。但由于某种原因，它只是自动将我的 index.html 发送到我的静态文件中。

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

app.use(express.static("public"));

app.get("/", (req, res) => {   //This sends the user to the index.html even tho i want to send 123
  res.send("123");
});

app.listen("3000");

标签： javascriptnode.jsexpress

解决方案

在编写代码时，express.static()中间件会查看/请求，index.html在公共目录中找到一个文件并将其作为/请求的响应。这是一个express.static()导致您与您的自定义路由发生冲突的功能"/"。

您在这里至少有四种解决方案选择：

  1. 您可以指定一个选项express.static()来禁用该index.html功能，以便它避开"/"路由并将控制权传递给您的后续路由处理程序。
  2. 您可以在路由express.static()之后移动中间件app.get("/", ...)，以便您的自定义路由在请求时获得第一个 dib。
  3. index.html您可以从公共目录中删除该文件，这样express.static()就不会找到它。对所有 HTML 文件使用模板系统，将所有 HTML 模板文件定位在其他一些express.static()看不到的目录（例如views目录）中，也会导致这种情况发生，或者只是将其移动到某个私有目录并从您的代码中使用它从私人目录也可以。
  4. 为所有静态资源提供一个公共路径前缀，这样静态资源和自定义路由处理程序之间就不会发生 URL 冲突。

第一个选项（禁用 index.html 中的功能express.static()）如下所示：

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

// disable index.html feature
app.use(express.static("public"), {index: false});

app.get("/", (req, res) => {
  res.send("123");
});

app.listen("3000");

第二个选项（更改路由定义/中间件的顺序）如下所示：

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

app.get("/", (req, res) => {
  res.send("123");
});

// put this after custom route definitions so they take precendence
app.use(express.static("public"));

app.listen("3000");

第四个选项（为所有静态资源提供公共路径前缀）如下所示：

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

app.use(express.static("/static", "public"));

app.get("/", (req, res) => {
  res.send("123");
});

app.listen("3000");

使用这第四个选项，您必须在所有静态 URL 前面加上静态前缀（您可以制作任何您想要的东西），因此"/"永远不会匹配express.static().

推荐阅读