在学习Node.js和MongoDB教程时,无法获取/index.html



我正在按照指南创建注册表单。以下步骤在尝试连接http://127.0.0.1:3000/时会带来错误

无法获取/index.html

我从C:Program FilesMongoDBServer4.4bin启动MongoDB

我唯一的代码变化是

mongoose.connect('mongodb://localhost:27017/gfg', { useNewUrlParser: true, useUnifiedTopology: true }); 

自从启动应用程序时,它就声明有不推荐使用的应用程序,但什么也没做。

MongoDB正确启动

mongod {"t":{"$date":"2020-09-28T20:39:11.740-04:00"},"s":"I",  "c":"NETWORK",  "id":23016,   "ctx":"listener","msg":"Waiting for connections","attr":{"port":27017,"ssl":"off"}}

和节点应用程序server listening at port 3000 connection succeeded,所以我不知道我在哪里搞砸了

我的目录看起来像这个

project root 
├── app.js
├── index.html
└── package-lock.json
├── signup_success.html
├── style.css

Firefox给我一个404 GET error on inspection

这是app.js

var express=require("express"); 
var bodyParser=require("body-parser"); 

const mongoose = require('mongoose'); 
mongoose.connect('mongodb://localhost:27017/gfg', { useNewUrlParser: true, useUnifiedTopology: true }); 
var db=mongoose.connection; 
db.on('error', console.log.bind(console, "connection error")); 
db.once('open', function(callback){ 
console.log("connection succeeded"); 
}) 

var app=express() 


app.use(bodyParser.json()); 
app.use(express.static(__dirname + "/../public")); 
app.use(bodyParser.urlencoded({ 
extended: true
})); 

app.post('/sign_up', function(req,res){ 
var name = req.body.name; 
var email =req.body.email; 
var pass = req.body.password; 
var phone =req.body.phone; 

var data = { 
"name": name, 
"email":email, 
"password":pass, 
"phone":phone 
} 
db.collection('details').insertOne(data,function(err, collection){ 
if (err) throw err; 
console.log("Record inserted Successfully"); 

}); 

return res.redirect('signup_success.html'); 
}) 


app.get('/', (req,res) => {   res.render('index.html');
}).listen(3000) 


console.log("server listening at port 3000"); 

如果在访问时遇到问题http://127.0.0.1:3000/并且得到这个错误Cannot GET/index.html,在var app=express((行之后添加以下行到app.js。

app.use(express.static(__dirname((;

"无法获取/index.html";错误将得到解决。

app.js

var express=require("express"); 
var bodyParser=require("body-parser"); 

const mongoose = require('mongoose'); 
mongoose.connect('mongodb://localhost:27017/gfg', { useNewUrlParser: true, useUnifiedTopology: true }); 
var db=mongoose.connection; 
db.on('error', console.log.bind(console, "connection error")); 
db.once('open', function(callback){ 
console.log("connection succeeded"); 
}) 

var app=express() 
app.use(express.static(__dirname));


app.use(bodyParser.json()); 
app.use(express.static(__dirname + "/../public")); 
app.use(bodyParser.urlencoded({ 
extended: true
})); 

app.post('/sign_up', function(req,res){ 
var name = req.body.name; 
var email =req.body.email; 
var pass = req.body.password; 
var phone =req.body.phone; 

var data = { 
"name": name, 
"email":email, 
"password":pass, 
"phone":phone 
} 
db.collection('details').insertOne(data,function(err, collection){ 
if (err) throw err; 
console.log("Record inserted Successfully"); 

}); 

return res.redirect('signup_success.html'); 
}) 


app.get('/', (req,res) => {   res.render('index.html');
}).listen(3000) 


console.log("server listening at port 3000");

index.html

<!DOCTYPE html>
<html>
<head>
<title> Signup Form</title>


<link rel="stylesheet"
href=
"https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"
integrity=
"sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u"
crossorigin="anonymous">    

<link rel="stylesheet" type="text/css" href="style.css">

</head>
<body>

<br>
<br>
<br>
<div class="container" >
<div class="row">
<div class="col-md-3">

</div>

<div class="col-md-6 main">

<form action="/sign_up" method="post">

<h1> Signup form </h1>

<input class="box" type="text" name="name" id="name"
placeholder="Name" required /><br>

<input class="box" type="email" name="email" id="email"
placeholder="E-Mail " required /><br>

<input class="box" type="password" name="password"
id="password" placeholder="Password " required/><br>

<input class="box" type="text" name="phone" id="phone"
placeholder="Phone Number " required/><br>
<br>
<input type="submit" id="submitDetails"
name="submitDetails" value="Submit" /><br>

</form>

</div>


<div class="col-md-3">
</div>

</div>
</div>
</body>
</html> 

所以您的问题是您的视图使用render。但是,您还没有指定渲染引擎(ejs、pug等(。

话虽如此,HTML文件不需要渲染引擎。你可以这样简单地为他们服务:

app.get('/', (req, res) => {
res.sendFile('index.html', {
root: './'
})
})

最新更新