我正在創建一個使用 Express.js 和 Pug 作為視圖引擎的應用程式。它有一個導航欄,將用戶重定向到 3 個可能的頁面:主頁、聯系人和我們的服務。
這里的問題是只有主頁成功顯示。其余頁面(contact.pug和our-services.pug)向我顯示錯誤:“GET http://localhost:3004/contact 404(未找到)”,盡管導航欄確實出現在每個頁面的頂部。
我確保對于所有頁面:
- 在呈現頁面的 routes 檔案夾中存在一個 js 檔案:
( routes/contact.js)
var express = require('express');
var router = express.Router();
var valid = require("../mychecker");
router.get('/contact', function(req, res){
if(valid()){
res.render('contact', {
name:"You can contact us here"
});
}
else res.send("you are using this website outside working hours.");
})
module.exports = router;
每個頁面的路由都匯入到 app.js 中,使用
app.use().每個頁面都可以通過
layout.pug. 它是每個page.pug檔案中包含的導航欄。
我試圖檢查我的主頁代碼與我的聯系人和我們的服務頁面代碼之間的任何差異,但我沒有發現任何不同之處。
這是我的 app.js 檔案:
var express = require('express');
var path = require('path');
var cookieParser = require('cookie-parser');
var logger = require('morgan');
var homeRouter = require('./routes/homepage');
var contactRouter = require('./routes/contact');
var servicesRouter = require('./routes/our-services');
var app = express();
app.listen(3004, function(){
console.log('Express listening on port', this.address().port);
});
// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'pug');
app.use(logger('dev'));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));
app.use(['/','/home'], homeRouter);
app.use('/contact', contactRouter);
app.use('/our-services', servicesRouter);
// catch 404 and forward to error handler
// error handler
app.use(function(err, req, res, next) {
// set locals, only providing error in development
res.locals.message = err.message;
res.locals.error = req.app.get('env') === 'development' ? err : {};
// render the error page
res.status(err.status || 500);
res.render('error');
});
module.exports = app;
這是我的 layout.pug 檔案:
doctype html
html
head
style(type="text/css").
nav {
background-color: black;
margin:0;
padding:5px;
}
nav a{
color:aliceblue;
text-decoration: none;
margin: 0 10px 10px 0;
}
nav
ul
a(href="home") Home
a(href="our-services") Services
a(href="contact") Contact
body
block content
最后,這是每個 page.pug 檔案的樣子:( views/contact.pug)
extends layout
block content
body
h1=name
uj5u.com熱心網友回復:
在 app.js 中創建、匯入和使用路由器檔案時,您在此處提供的路由:
app.use('/contact', contactRouter);
用于您的家鄉路線之上。這意味著聯系頁面的鏈接是 - HTTP://localhost:3004/contact/contact。對于您創建的每個路由器都是如此。
如果您希望頁面 url 為 localhost:3004/contact/ ,則應將陳述句更改為:
router.get('/', function(req, res){
if(valid()){
res.render('contact', {
name:"You can contact us here"
});
}
else res.send("you are using this website outside working hours.");
})
轉載請註明出處,本文鏈接:https://www.uj5u.com/houduan/456742.html
標籤:javascript 节点.js 表示 哈巴狗
