ExpressJS/节点：404 张图片

Question

我已经设置了一个基本的节点/express 服务器，它可以很好地提供公共静态 javascript 和 css 文件，但在尝试提供图像时返回 404 错误。

最奇怪的部分是，在本地运行时一切正常。当在我的远程服务器（linode）上运行时，出现图像问题。

这真的让我摸不着头脑...可能是什么问题？

这是服务器：

/**
 * Module dependencies.
 */

var express = require('express')
  , routes = require('./routes')

var app = module.exports = express.createServer();

// Configuration

app.configure(function(){
  app.set('views', __dirname + '/views');
  app.set('view engine', 'jade');
  app.use(express.bodyParser());
  app.use(express.methodOverride());
  app.use(express.compiler({ src: __dirname + '/public', enable: ['less'] }));
  app.use(express.static(__dirname + '/public'));
  app.use(app.router);
});

app.configure('development', function(){
  app.use(express.errorHandler({ dumpExceptions: true, showStack: true })); 
});

app.configure('production', function(){
  app.use(express.errorHandler()); 
});

// Globals

app.set('view options', {
  sitename: 'Site Name', 
  myname: 'My Name'
});

// Routes

app.get('/', routes.index);
app.get('/*', routes.fourohfour);

app.listen(3000);
console.log("Express server listening on port %d in %s mode", app.address().port, app.settings.env);

Answer 1

如果在本地工作正常，可能是区分大小写的问题，您的文件是否有大写字母等？

Answer 2

我遇到了这个问题，但最终结果是我在尾随的 .JPG 扩展名中有大写字母，并且在 html 中调用 .jpg 。 Windows 对文件类型不区分大小写，CentOS 则...

Answer 3

好吧，我通过将图像文件夹从“/public/images”重命名为/public/image 解决了这个问题。我不知道为什么命名会引起问题，但我很高兴这就是所需要的。

Answer 4

我遇到了这个问题。上传到

/static/uploads

的所有用户生成的图像均未通过 Express 渲染。奇怪的是

static/images

、

static/js

、

static/css

中的所有内容都撕得很好。我确保这不是权限问题，但仍然收到 404。最后，我配置 NGINX 来渲染我的静态文件的all（无论如何，这可能更快）并且它起作用了！

我仍然很想知道为什么 Express 不渲染我的图像。

如果有人遇到此问题，这是我的 NGINX 配置：

server {

    # listen for connections on all hostname/IP and at TCP port 80
    listen *:80;

    # name-based virtual hosting
    server_name staging.mysite.com;

    # error and access outout
    error_log /var/log/nginx/error.log;
    access_log /var/log/nginx/access.log;

    location / {
            # redefine and add some request header lines which will be transferred to the proxied server
            proxy_set_header                X-Real-IP $remote_addr;
            proxy_set_header                X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header                 Host $http_host;
            proxy_set_header                X-NginX-Proxy true;

            #set the location of the web root
            root /var/www/mysite.com;

            # set the address of the node proxied server. port should be the port you set in express
            proxy_pass                      http://127.0.0.1:9001;

            # forbid all proxy_redirect directives at this level
            proxy_redirect                  off;
    }

    # do a case insensitive regular expression match for any files ending in the list of extentions
    location ~* ^.+\.(html|htm|png|jpeg|jpg|gif|pdf|ico|css|js|txt|rtf|flv|swf)$ {

            # location of the web root for all static files
            root /var/www/mysite.com/static;

            # clear all access_log directives for the current level
            #access_log off;

            # set the Expires header to 31 December 2037 23:59:59 GMT, and the Cache-Control max-age to 10 years
            #expires max;
    }
}

Answer 5

我遇到了一个问题，只需从 css 背景图像 url 中删除双引号即可解决问题

#logo{
    width: 40px;
    height: 40px;
    background-image: url(/static/assets/logo.jpeg);
    background-position: center;
    background-size: cover;
    margin: 4px 8px;
}