使用express.js和jade处理路由和文件

时间:2014-12-09 21:51:35

标签: javascript html css node.js express

当我进入1级深度的路线时,我在访问node.js网络应用中的某些图像文件时遇到了一些问题。这是因为css将查找将该级别添加到指定路径开头的1级的资产。

例如,在我的布局中,我有一个名为main.css的css文件的链接。 main.css有一个名为.icon{background:url('../imgs/ok.png');}的类当我转到我的登录页面app.get('/login', routes.login)时,该文件的路径为/imgs/ok.png,此处图像加载到UI中。当我尝试访问具有一个额外级别app.get('/events/:id', routes.loadEvent)的以下路由时,会发生此问题。该额外级别会添加到css网址/events/imgs/ok.png,并且图片不再加载到用户界面中。

如果有人能帮我找到解决问题的方法,我将不胜感激。

提前致谢

这是我的app.js文件

module.exports = function (Events, db) {
    var express = require('express');
    var validator = require('validator');
    var MongoStore = require('connect-mongo')(express);
    var passport = require('./auth');
    var routes = require('./routes')(Events);
    var path = require('path'); 
    var app = express();

    // all environments
    app.set('port', process.env.PORT || 4000);
    app.set('views', __dirname + '/views');
    app.set('view engine', 'jade');
    app.use(express.favicon());
    app.use(express.logger('dev'));
    app.use(express.cookieParser());
    app.use(express.session({
        secret: 'keyboard cat',
        store: new MongoStore({mongoose_connection: db})
    }))
    app.use(passport.initialize());
    app.use(passport.session());
    app.use(express.bodyParser({uploadDir:'./uploads'}));
    app.use(express.methodOverride());
    app.use(function (req, res, next) {
        res.set('X-Powered-By', 'TShare');
        next();
    });
    app.use(app.router);
    app.use(express.static(path.join(__dirname, './public')));
    app.use("/event", express.static(path.join(__dirname, './public')));

    // development only
    if ('development' == app.get('env')) {
        app.use(express.errorHandler());
    }

    app.get('/events/:id', routes.singleEvent);
    app.get('/login', routes.login);



    return app;
}

1 个答案:

答案 0 :(得分:0)

您在css中使用相对路径 - 更改它们以便它们开始~/ ~字符代表应用程序的根目录。