javascript - 如何使用 Node、Express 通过浏览器将图像、CSS 和 JS 等浏览器内容发送到 html？

Question

在一个项目上工作并尝试使用 nodejs 和 express 来使用 API。显示信息时出现问题。

直接用浏览器打开index.html文件，显示完美。但是当尝试使用 node 和 express 这样做时，得到以下信息:

server.js:

var Access_token = 'ACCESS_TOKEN';

var AirTable = require('airtable');
var base = new AirTable({apiKey:Access_token}).base('BASE');
var TableName = 'TABLE_NAME';
var ViewName = 'Grid view';

var express = require('express');
var app = express();


app.get('/', function(request, response){
  console.log(__dirname);
  response.sendFile(__dirname + '/index.html');
});

var listener = app.listen(process.env.PORT || '3000', function(){
  console.log("Your app is listening to port " + listener.address().port);
});

这是我的文件目录的样子

发生了什么事，我该怎么办？它清楚地显示了 index.html，但它从不提取 css、scripts 或 images。

Answer 1

您必须让 Express 知道对特定 URL 的请求将针对相应文件夹中的静态 Assets ，而不是尝试自行路由。在您的监听器之前添加这些行:

app.use(express.static('css'));
app.use(express.static('fonts'));
app.use(express.static('img'));
app.use(express.static('js'));

文档:Serving static files in Express