找不到Node.js公共css文件404
Node.js public css files 404 not found
我正在学习node.js,在将公共CSS文件提供给一个URL时出错。它几乎适用于所有页面,我进入页面,css文件从127.0.0.1/css/style.css加载。当URL为127.0.0.1/project/idProject时,它会尝试从127.0.0.1/project/css/style.css获取css文件。
// INCLUDE MODULES =======================================================
var express = require('express');
var app = express();
var server = require('http').createServer(app);
var io = require('socket.io').listen(server);
var Twig = require('twig');
var twig = Twig.twig;
var path = require('path');
var mongoose = require('mongoose');
var passport = require('passport');
var flash = require('connect-flash');
var configDB = require('./config/database.js');
// Assets ================================================================
app.use(express.static(path.join(__dirname, 'public')));
app.use(express.favicon(path.join(__dirname, 'public/images/favicon.ico')));
// Start mongoose
mongoose.connect(configDB.url);
// USER MANAGEMENT =======================================================
require('./config/passport')(passport); // pass passport for configuration
app.use(express.logger('dev')); // log every request to the console
app.use(express.cookieParser()); // read cookies (needed for auth)
app.use(express.json()); // to support JSON-encoded bodies
app.use(express.urlencoded()); // to support URL-encoded bodies
app.set('view engine', 'twig'); // set up twig for templating
app.use(express.session({ secret: 'ilovescotchscotchyscotchscotch' })); // session secret
app.use(passport.initialize());
app.use(passport.session()); // persistent login sessions
app.use(flash())
// ROUTES =======================================================
// Set authentication variable
app.use(function (req, res, next) {
app.locals.login = req.isAuthenticated();
next();
});
require('./app/routes.js')(app, passport);
//ERROR MANAGEMENT =======================================================
app.use(app.router);
app.use(function(req, res, next){
res.status(404);
// respond with html page
if (req.accepts('html')) {
res.render('errors/404.twig', { url: req.url });
return;
}
// respond with json
if (req.accepts('json')) {
res.send({ error: 'Not found' });
return;
}
// default to plain-text. send()
res.type('txt').send('Not found');
});
/*app.use(function(err, req, res, next){
// we may use properties of the error object
// here and next(err) appropriately, or if
// we possibly recovered from the error, simply next().
res.status(err.status || 500);
res.render('errors/500.twig', { error: err });
});*/
//SOCKET IO =======================================================
//Quand on client se connecte, on le note dans la console
io.sockets.on('connection', function (socket) {
console.log("New connection");
});
// LISTEN SERVER =======================================================
server.listen(80);
你知道怎么解决这个问题吗?
问候!
我尝试了在评论中看到的方法,因为它对我不起作用,所以我发布了一个有效的答案。
所有.css文件都是静态的,所以必须将它们提供给客户端。但是,您不能将静态文件作为一个快速中间件来提供。因此,你必须添加它们。
app.use(express.static(__dirname, 'css'));
嗨,解决这个问题对我来说是个问题,但在萨尔瓦多的帮助下,这是可能的。
我唯一要放的就是所有的代码和你在html中引用的内容,你只需要把文件而不是文件夹放在html文件中。
//The index.js code
var express = require('express');
const path = require ('path');
//app va a ser mi servidor.
var app = express();
app.set('port', 3000)
//app.use(express.static('./public'));
//app.use(express.static( 'css'));
app.use(express.static(path.join(__dirname, 'public')));
app.use(express.static(path.join(__dirname, 'css')));
app.listen(app.get('port'), () => {
console.log('localhost:3000')
} );
这就是结构
相关文章:
- 关于引入外部javascript文件的问题&css通过https
- 如何修复:当javascript更改DOM时,iOS会删除CSS文件
- 使用Javascript读取CSS文件并动态更改页面
- 限制对HTML/CSS/IMG或根索引文件夹的访问
- 压缩静态HTML文件中的JS和CSS
- js和css文件-在publichtml外部或内部
- Yii2从js脚本的页面上添加来自供应商文件夹的图像、css、js文件
- 加载具有特定CSS的HTML文件
- 将Rails后端添加到JS/HTML/CSS应用程序时,正确的文件位置是什么
- Google PageSpeed Insights与多个CSS文件
- Bootstrap CSS和JS我必须将它们包含在单独的文件中,或者可以编译它们
- Javascript:动态更改CSS文件+Cookie
- 最小化CSS/JS文件,并使用命令行创建一个文件
- 浏览器缓存PHP生成的CSS和Javascript文件
- Nodejs和express无法定位资源文件(CSS&JS文件)
- 如何在Java web应用程序中自动控制静态文件(css、js、image)的版本
- 如何在基于angular-fullstack的应用中包含库文件(css/js)
- MeteorJS外部文件:css和js
- 使用javascript+jquery轻松地重新设计输入类型文件.Css需要在jsfiddle上修复D:
- 在gulp中用0kb的文件css