Question

我正在尝试将静态文件放在我的公共文件夹中，例如html，css和js文件，但是他们不会获取到获取网址（＆＃39; /＆＃39;）。这是我的文件夹结构

app.js
node_modules
--express
package.json
public
--style.css

我的应用是：

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

var port = process.env.PORT || 3000;

app.use('/assets', express.static(__dirname + '/public'));

app.get('/', function(req, res){
    res.send('<html><head><link href=assets/style.css type=text/css rel=stylesheet/></head><body><h1>Hello World</h1></body></html>');
});

app.get('/person/:id', function(req, res){
    res.send('<html><head></head><body><h1>Person: ' + req.params.id + '</h1></body></html>');
});

app.get('/api', function(req, res){
    res.json({ firstname: 'John', lastname: 'Doe' });
});

app.listen(port);

样式代码是：

 style.css:
 body {
       font-family: Arial, Helvetica, sans-sarif;   
}

Answer 1

你的问题是，因为

<link href=assets/style.css type=text/css rel=stylesheet/>

等于

<link href=assets/style.css type=text/css rel="stylesheet/">

如果您不使用引号，则该值将由以下字符之一终止："，'，=，>，{{1} }或<（有关详细信息，请参阅W3C: 4.4. Attributes）。截至此，`值>已终止您的值。

因此stylesheet/的{{1}}为rel而不是link，这就是没有加载样式表的原因。

因此，您必须在stylesheet/和stylesheet之间添加空格：

stylesheet

或者您需要使用引号。

Answer 2

您可以将“公共”重命名为“资产”，然后使用...

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

Answer 3

HTML语句中存在链接到CSS文件的语法错误。您忘了将值括在双引号中。

请使用以下格式：

<link rel="stylesheet" type="text/css" href="assets/style.css">

如果您使用ES6支持Node.JS，那么您可以使用反向标记（``）来更好地格式化内联HTML代码，如：

app.get('/', function(req, res){
    res.send(`
        <html>
        <head>
        <link rel="stylesheet" type="text/css" href="assets/style.css">
        </head>
        <body>
        <h1>Hello World</h1>
        </body>
        </html>`
        );
});

为什么我的公共文件夹没有为＆＃39; /＆＃39;提取文件？我的NodeJS应用程序中的URL？

3 个答案: