2016-03-14 68 views
1

我想使用express.js爲單個頁面應用(角核)定義默認路由。當請求靜態文件並且它不存在於路由中時,會發生該問題。在這種情況下,將返回默認頁面內容而不是404狀態(未找到)。示例代碼:如何定義不包含靜態資源的默認路由

var path = require('path'); 
var express = require('express'); 
var app = express(); 
var router = express.Router(); 
router.use(express.static(path.join(__dirname, '/scripts'))); 
router.get('*', function(request, response) { 
    response.sendFile(path.join(__dirname, 'views/index.html')); 
}); 
app.use(router); 
app.listen(80); 

是存在一個很好的解決方案,以排除對靜態文件的默認路由和處理404狀態正常嗎?對於文件url而不是通配符的正則表達式是否是一個好方法?

回答

2

您需要能夠判斷是否正在爲腳本文件發出請求。問題是,你有這樣的目錄結構:

/root 
    /scripts 
    foo.js 
    bar.js 

而且您設置靜態處理程序,以允許用戶加載這樣的腳本:

<script src="/foo.js"></script> 

你需要做的是設置你的文件夾結構是這樣的:

/root 
    /static 
    /scripts 
     foo.js 
     bar.js 

...然後設置靜態處理程序:

router.use(express.static(path.join(__dirname, '/static'))); 

...然後更新您的腳本標籤:

<script src="/scripts/foo.js"></script> 

...最後更新包羅萬象的路線,以檢查是否有人試圖加載腳本:

router.get('*', function(request, response) { 
    if (request.originalUrl.indexOf("/scripts/") > -1) { 
     response.status(404); 
     response.send('Nah Nah Nah'); 
    } else { 
     response.sendFile(path.join(__dirname, 'views/index.html')); 
    } 
}); 

更新:將所有靜態資產保留在static文件夾中是個好主意。你應該組資產按類型:腳本,CSS,字體,圖片等,然後您可以更新您的包羅萬象的處理程序是這樣的,其將404如果URL中包含/scripts//css//img/,或/fonts/

var REG_STATIC_ASSET = /\/(?:scripts|css|img|fonts)\//; 
router.get('*', function(request, response) { 
    if (REG_STATIC_ASSET.test(request.originalUrl)) { 
     response.status(404); 
     response.send('Nah Nah Nah'); 
    } else { 
     response.sendFile(path.join(__dirname, 'views/index.html')); 
    } 
}); 
+0

好的,謝謝!什麼情況下,當我有20個靜態處理程序?我應該創建另一個父目錄,把所有的靜態文件夾給他們,並驗證它在默認路由? – estradowiec

+0

我更新了我的答案以解決您的評論。 20個靜態處理程序有點雄心勃勃;) - 您只需要一個靜態處理程序,並將您的資產組合在一起。 –

+0

太棒了!我可以使用多個靜態處理程序,因爲我的應用程序是可插入的。換句話說,應用程序中的每個插件都可以擁有自己的靜態資源。 – estradowiec