代码不提供公用文件夹中的静态 html 文件

Question

探索快速框架。学习 express.static 中间件，但它没有按我期望的方式运行。

代码：

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

app.use((req, res, next) =>{
    express.static('public');
    next();
}); 

app.use((req, res) => {
  console.log("Starting first middleware");
});

app.listen(3000);

以上代码不提供我在 publlic 文件夹中的静态 html 文件。 public 文件夹与此 JS 文件位于同一目录，例如当我使用 URL http://localhost:3000/home.html 尝试访问 [=33] 中的 home.html 文件时=]文件夹我无法访问它。

当我切换 express.static 最后的顺序时，它确实为 public 文件夹中的静态 html 文件提供服务。

代码：

app.use((req, res, next) => {
  console.log("Starting first middleware");
  next();
});

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

问题：

为什么第一个代码示例中的应用程序不提供静态文件？

Answer 1

这两个片段之间存在根本区别。您会看到第一个基本上是在您声明的中间件的回调函数中使用参数 'public' 调用函数 express.static，这只会 return 一个不会在下一个中使用的函数中间件，因为没有传递给它的参数； req 对象应该传递给它。然而，在第二个中，这将 return 一个可以使用 req 对象的函数，该对象通常在 app.use 中与 res 一起传递。查看 'static' 函数的一些源代码以获得一个想法：

 function serveStatic (root, options) {
  if (!root) {
    throw new TypeError('root path required')
  }

  if (typeof root !== 'string') {
    throw new TypeError('root path must be a string')
  }

  // copy options object
  var opts = Object.create(options || null)

  // fall-though
  var fallthrough = opts.fallthrough !== false

  // default redirect
  var redirect = opts.redirect !== false

  // headers listener
  var setHeaders = opts.setHeaders

  if (setHeaders && typeof setHeaders !== 'function') {
    throw new TypeError('option setHeaders must be function')
  }

  // setup options for send
  opts.maxage = opts.maxage || opts.maxAge || 0
  opts.root = resolve(root)

  // construct directory listener
  var onDirectory = redirect
    ? createRedirectDirectoryListener()
    : createNotFoundDirectoryListener()

  return function serveStatic (req, res, next) { // the funciton returned
    if (req.method !== 'GET' && req.method !== 'HEAD') {
      if (fallthrough) {
        return next()
      }

      // method not allowed
      res.statusCode = 405
      res.setHeader('Allow', 'GET, HEAD')
      res.setHeader('Content-Length', '0')
      res.end()
      return
    }

    var forwardError = !fallthrough
    var originalUrl = parseUrl.original(req)
    var path = parseUrl(req).pathname

    // make sure redirect occurs at mount
    if (path === '/' && originalUrl.pathname.substr(-1) !== '/') {
      path = ''
    }

    // create send stream
    var stream = send(req, path, opts)
    //rest of code...

Answer 2

express.static 是 returns 另一个函数（中间件）的函数，Express 中间件需要 2 或 3 个参数（req、res[、next]）。

当它用作回调时，像这样：

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

您不需要明确地向它提供参数，因为 app.use 会为您提供它们。

但是，当你自己使用它时，你需要显式调用函数及其参数：

app.use((req, res, next) =>{
    express.static('public')(req, res, next);
    next();
});

在您的第一个示例中，您生成了中间件，但没有执行它。

代码不提供公用文件夹中的静态 html 文件

Code doesn't serve my static html files in the publlic folder

javascript

middleware

node.js

express

代码：

代码：

问题：