2016-03-10 35 views
0

我不知道如何爲它添加詞組(這就是爲什麼谷歌無法幫助我......)讓我給你舉個例子。Nodejs express路由:如果添加了「/」,沒有樣式

如果我去我的頁面mypage.whatever/login,一切都很好。

但是,如果我去mypage.whatever/login/,頁面沒有樣式。它只有HTML。

在我的主節點/快遞文件我有app.use("/login", login);

在login.js文件我都:

router.get("/", function(req,res){ res.render("login", {title: "Login page"}); });

我怎麼能解決這個問題?

在此先感謝。

編輯:

感謝Manasov丹尼爾和jfriend00,我發現問題出在哪裏來的。

當我添加「/」時,樣式表不包含在內,因爲路由會混亂。

舉例來說,像這樣

<link rel="stylesheet" href="stylesheets/login.css">

樣式表而不是尋找something/stylesheets/login.css

瀏覽器搜索something/login/stylesheets/login.css

你們是否有一個想法如何解決呢?

+0

試試這個'app.use(「/ login/*」,login);' –

+0

你能顯示'login'模板的內容嗎?我認爲問題出現在樣式表路線中。 –

+0

您在HTML文件中使用什麼路徑來處理CSS文件?您是否在瀏覽器控制檯中看到任何錯誤? – jfriend00

回答

0

在你的主節點/快遞文件,您有:

app.use('/login', require('./your_file_path/login')); // login.js file path 

而在login.js文件,你應該有:

router.get("/login", function(req,res){ 
    res.render("login", {title: "Login page"}); 
}); 
+0

我確實有這個,我忘了包括它對不起。 「login」變量引用var login = require(「./ routes/login」); –

0

要回答的編輯部分:

添加一個預斜槓到我的CSS路線修復了這個問題。

即從HREF = 「東西/ myfile.css」 到HREF = 「/事/ myfile.css」

我真的不明白爲什麼雖然。

+0

這是相對路徑('something/myfile.css')和絕對路徑('/ something/myfile.css')之間的區別。相對路徑從當前位置開始,因爲這個問題將是'login',而絕對路徑則從應用程序根目錄開始。 –

2

當你的樣式表都包含這樣的路徑:

<link rel="stylesheet" href="stylesheets/login.css"> 

然後,瀏覽器會將其視爲相對路徑和它們相對於當前頁面的路徑進行評估。這是很少你想要的共享資源,所以你或許應該改變使用這樣的斜線:

<link rel="stylesheet" href="/stylesheets/login.css"> 

當你這樣做,或者沒有尾隨斜線是因爲它的工作方式不同的原因當沒有結尾斜槓時,/login被視爲文件名,/是路徑。因此,stylesheets/login.css將與/結合,結果將爲/stylesheets/login.css,它會起作用。

但是,如果您使用/login/,則將其視爲路徑,並將該路徑與您的樣式錶鏈接組合起來,以使您的/login/stylesheets/login.css不起作用。

答案是始終在樣式錶鏈接中包含根路徑(例如以/開頭的內容)。然後,它們不會與頁面的路徑結合,只與頁面的域和端口結合。

相關問題