托管静态 Node.js 页面答案

【问题标题】：Hosting a static Node.js page托管静态 Node.js 页面
【发布时间】：2016-12-07 08:25:50
【问题描述】：

我正在尝试了解 Node.js，并按照 Lynda.com 上的指南编写了一个简单的 Node.js page，其中包含 express 和 ejs。我将页面托管在 Amazon AWS 服务器上并安装了 Nginx。当我运行节点应用程序时，我可以访问 IP:3000 的页面。我还按照几个不同的指南设置了 Nginx，将服务器 IP/ 重定向到端口 3000。但是，当我尝试访问 IP/ 页面时，没有图像或 CSS 出现。

我过去使用 Ruby on Rails 为学校设置了一些网页，我假设这是一个开发与生产问题。我发现的大多数指南/说明只是显示为一个简单的 hello world 应用程序设置 Nginx，而不需要任何图像或 CSS。有人可以指导我找到合适的资源来完成我在这里尝试做的事情吗？

编辑：这是我的 app.js 和我的两条路线应用程序.js

var express = require('express');
var reload = require('reload');
var app = express();
var clientFile = require('./data/clients.json');
var instructionFile = require('./data/instructions.json');

app.set('port', process.env.PORT || 3000);
app.set('clientData', clientFile);
app.set('instructionData', instructionFile);
app.set('view engine', 'ejs');
app.set('views', './views');

app.locals.siteTitle = 'Roux Meetups';

app.use(express.static('./public'));
app.use(require('./routes/index'));
app.use(require('./routes/instructions'));

var server = app.listen(app.get('port'), function() {
  console.log('Listening on port ' + app.get('port'));
});

reload(server, app);

var express = require('express');
var router = express.Router();

路线 1

router.get('/', function(req, res) {
  var clients = req.app.get('clientData');
  var clientPhotos = clients.images;
  var clientAddresses = clients.sites;

  res.render('index', {
    pageTitle: 'Home',
    clients: clientPhotos,
    sites: clientAddresses,
    pageID: 'home'
  });
});

module.exports = router;

路线 2

var express = require('express');
var router = express.Router();

router.get('/instructions', function(req, res) {
  var clients = req.app.get('clientData');
  var clientPhotos = clients.images;
  var clientAddresses = clients.sites;

  var instructions = req.app.get('instructionData');
  var instructPhotos = instructions.images;

  res.render('instructions', {
    pageTitle: 'Instructions',
    clients: clientPhotos,
    sites: clientAddresses,
    instructs: instructPhotos,
    pageID: 'instructions'
  });
});

module.exports = router;

我也只编辑了我的 /etc/nginx/sites-available/default 为 nginx 使用以下内容

server {
listen 80 default_server;
listen[::]:80 default_server;

root /var/www/html;

index index.html index.html index.nginx-devian.html;

server_name _;

location / {
    proxy_pass http://localhost:3000;
    try_files $uri $uri/ = 404;
}
}

【问题讨论】：

你检查过浏览器上的元素吗？检查它查看照片 css 的位置，然后您就会明白问题所在 \
或者试试这个服务器配置upstream nodejs { server localhost:3000; } server { listen 8080; server_name localhost; root ~/workspace/test/app; location / { try_files $uri $uri/ @nodejs; } location @nodejs { proxy_redirect off; proxy_http_version 1.1; proxy_pass http://nodejs; proxy_set_header Host $host ; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; } }
那是 nginx 配置的服务器配置吗？如果我转到 IP/:3000 而不是当我转到 IP/ 并让 nginx 重定向到端口 3000 时，为什么相对图像/css 位置会正常工作？我试图准确了解这一切是如何协同工作的，但似乎缺少一些关键。
如果不查看您的 Express 代码和您使用它定义的路由，也许还有 nginx 配置（如果您希望 nginx 提供静态页面），我们无法真正帮助您。 Express 默认不提供任何文件。您希望它服务的每个文件，无论是静态文件还是其他文件，都必须包含在路由定义中。如果需要，express.static() 可用于定义自动提供静态文件的路径。或者，也可以将 nginx 配置为提供静态文件。

标签： javascript css node.js nginx

【解决方案1】：

所以我的问题是我的 /etc/nginx/sites-available/default 配置错误。我用垃圾编辑了它，完全忘记了。留下这个，但万一其他人有类似的问题。我从https://www.digitalocean.com/community/tutorials/how-to-set-up-a-node-js-application-for-production-on-ubuntu-14-04得到的正确的nginx配置

【讨论】：