2016-12-06 72 views
-1

我想了解Node.js,我已經寫了一個簡單的Node.js page與快遞和ejs按照在Lynda.com指南。我將該頁面託管在Amazon AWS服務器上,並安裝了Nginx。當我運行節點應用程序時,我可以訪問IP:3000的頁面。我還設置了Nginx,遵循幾個不同的指南將服務器IP /重定向到端口3000.然而,當我嘗試訪問IP /的頁面時,沒有任何圖像或CSS出現。主持一個靜態Node.js頁面

我在過去爲使用Ruby on Rails的學校設置了一些網頁,我假設這是一個開發vs生產問題。我發現的大多數指南/說明只是展示如何設置Nginx來獲取一個簡單的Hello World應用程序,而不需要任何圖像或CSS。有人可以指導我去適當的資源來完成我在這裏要做的事嗎?

編輯:這是我的app.js和我的兩個路線 app.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/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; 
} 
} 
+0

你檢查過瀏覽器上的元素嗎? 檢查它看到照片css的位置,然後您將瞭解問題\ –

+0

或嘗試此服務器配置 'upstream nodejs server localhost:3000; } server { listen 8080; server_name localhost; root〜/ workspace/test/app; 位置/ { try_files $ uri $ uri/@nodejs; } location @nodejs { proxy_redirect off; proxy_http_version 1.1; proxy_pass http:// nodejs; proxy_set_header主機$主機; proxy_set_header X-Real-IP $ remote_addr; proxy_set_header X-Forwarded-For $ proxy_add_x_forwarded_for; } }' –

+0

nginx配置是否是服務器配置?爲什麼如果我轉到IP /:3000而不是當我轉到IP /並且nginx重定向到端口3000時相對圖像/ css位置工作正常?我試圖理解這一切如何一起工作,但我似乎缺少一些關鍵。 – jawknee530

回答