Javascript 如何解析单击按钮的用户
当用户注册时,他们会被重定向到/proto(显示可供收养的动物列表)。问题是,我如何让点击按钮的确切用户(因为这需要与所选的确切宠物一起解析)进入/admin页面。 下面是我的代码app.jsJavascript 如何解析单击按钮的用户,javascript,node.js,mongodb,express,mongoose,Javascript,Node.js,Mongodb,Express,Mongoose,当用户注册时,他们会被重定向到/proto(显示可供收养的动物列表)。问题是,我如何让点击按钮的确切用户(因为这需要与所选的确切宠物一起解析)进入/admin页面。 下面是我的代码app.js //jshint esversion:6 const express = require("express"); const bodyParser = require("body-parser"); const ejs = require("ejs&quo
//jshint esversion:6
const express = require("express");
const bodyParser = require("body-parser");
const ejs = require("ejs");
const mongoose = require('mongoose');
var multer = require('multer');
var mongoose = require('mongoose');
var imgModel = require('./model');
const app = express();
var fs = require('fs');
var path = require('path');
app.set('view engine', 'ejs');
app.use(express.static('public'));
app.use(bodyParser.urlencoded({extended: true}));
app.use(bodyParser.json())
mongoose.connect("mongodb://localhost:27017/sanctDB", {useNewUrlParser:true});
var storage = multer.diskStorage({
destination: (req, file, cb) => {
cb(null, 'uploads')
},
filename: (req, file, cb) => {
cb(null, file.fieldname + '-' + Date.now())
}
});
var upload = multer({ storage: storage });
const userSchema = {
email : String,
password: String,
name: String
};
var imageSchema = new mongoose.Schema({
img:
{
data: Buffer,
contentType: String
},
name: String,
dob: String,
breed: String,
details: String
});
module.exports = mongoose.model('Image', imageSchema);
const User = mongoose.model("User", userSchema);
app.get("/", function(req,res){
res.render("home");
});
app.get("/login", function(req,res){
res.render("login");
});
app.get("/register", function(req,res){
res.render("register");
});
app.get("/admin", function(req,res){
res.render("adminlogin");
});
app.get("/addNew", function(req,res){
res.render("addNewAnimal");
});
app.get("/showAdopted", function(req,res){
res.render("showAdopted");
});
app.get("/viewAll", function(req,res){
res.render("viewAll");
});
app.get('/proto', (req, res) => {
imgModel.find({}, (err, items) => {
if (err) {
console.log(err);
res.status(500).send('An error occurred', err);
}
else {
res.render("prototype", { items: items });
}
});
});
app.post("/register", function(req,res){
const newUser = new User({
name : req.body.name,
email: req.body.username,
password: req.body.password
});
newUser.save(function (err){
if (err){
console.log(err);
} else {
res.redirect("proto");
}
});
});
app.post("/login", function(req, res){
const username = req.body.username;
const password = req.body.password;
User.findOne({email:username}, function(err,foundUser){
if (err){
console.log(err);
} else{
if (foundUser){
if (foundUser.password === password){
res.render("secrets");
}
}
}
});
});
app.post("/adminlogin", function(req, res){
const username = req.body.username;
const password = req.body.password;
User.findOne({email:username}, function(err,foundUser){
if (err){
console.log(err);
} else{
if (foundUser){
if (foundUser.password === password){
res.render("adminPage");
}
}
}
});
});
app.post("/proto",(req, res, next) =>{
var obj = {
name: req.body.username,
}
console.log(obj)
});
app.post("/addNewAnimal",upload.single('image'), (req, res, next) =>{
var obj = {
name: req.body.petName,
dob: req.body.petDob,
breed: req.body.petBreed,
details: req.body.petDescription,
img: {
data: fs.readFileSync(path.join(__dirname + '/uploads/' + req.file.filename)),
contentType: 'image/png'
}
}
imgModel.create(obj, (err, item) => {
if (err) {
console.log(err);
}
else {
// item.save();
res.redirect('/proto');
}
});
console.log(obj.name)
});
app.listen(3000, function() {
console.log("Server started on port 3000");
});
和my/prototype.ejs
<%- include('partials/header') %>
<div class="row">
<% items.forEach(function(items){ %>
<div class="card col-lg-4 col-md-6">
<img alt="John" style="width:100%" src="data:image/<%=items.img.contentType%>;base64,
<%=items.img.data.toString('base64')%>">
<h6><%=items.name%></h6>
<h6><%=items.dob%></h6>
<h6><%=items.breed%></h6>
<h6><%=items.details%></h6>
<p><button>adopt</button></p>
</div>
<% }) %>
</div>
<%- include('partials/footer') %>
;base64,
">
领养
and/register.ejs
<div class="container mt-5">
<h1>Register</h1>
<div class="row">
<div class="col-sm-8">
<div class="card">
<div class="card-body">
<!-- Makes POST request to /register route -->
<form action="/register" method="POST">
<div class="form-group">
<label for="name">Full Name</label>
<input type="text" class="form-control" name="name">
</div>
<div class="form-group">
<label for="email">Email</label>
<input type="email" class="form-control" name="username">
</div>
<div class="form-group">
<label for="password">Password</label>
<input type="password" class="form-control" name="password">
</div>
<button type="submit" class="btn btn-dark">Register</button>
</form>
</div>
</div>
</div>
<!-- <div class="col-sm-4">
<div class="card social-block">
<div class="card-body">
<a class="btn btn-block" href="/auth/google" role="button">
<i class="fab fa-google"></i>
Sign Up with Google
</a>
</div>
</div>
</div> -->
</div>
</div>
<%- include('partials/header') %>
登记
全名
电子邮件
密码
登记
最后是adminPage.ejs
<%- include("partials/header"); -%>
<section class="colored-section" id="adminTitle">
<div class="container-fluid">
<!-- Nav Bar -->
<nav class="navbar navbar-expand-lg navbar-dark">
<a class="navbar-brand" href="">AAS</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarTogglerDemo02">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarTogglerDemo02">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="/addNew">Add new</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#pricing">Show adopted</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#cta">View All</a>
</li>
</ul>
</div>
</nav>
<%- include("partials/footer"); -%>
-
-
-
非常感谢您提供详细的解释!!如果您正在开发一个需要用户注册和后续身份验证的应用程序,我建议您使用JSON Web令牌()之类的东西将用户身份验证合并到您的应用程序中。使用Express,您应该能够创建一些身份验证中间件().当您在编写的中间件函数中对用户进行身份验证时,您可以将从Mongoose获得的用户对象放置到Express从中间件传递到路由的请求对象上。如下所示
const jwt = require('jsonwebtoken')
const User = require('../models/user')
const auth = async (req, res, next) => {
try {
const token = req.header('Authorization').replace('Bearer ', '')
const decoded = jwt.verify(token, 'shhh')
const user = await User.findOne({ _id: decoded._id, 'tokens.token': token })
if (user) {
req.user = user
req.token = token
next()
} else {
throw new Error()
}
} catch (error) {
res.status(401).send({ error: 'Please authenticate'})
}
}
module.exports = auth
当然,这只是解决方案的一半,因为您必须确保将有效令牌传递回客户端,并将该令牌存储在登录路由处理程序中的用户模型中。然后,您必须确保客户端将在HTTP请求的授权标头内将有效令牌传递给服务器解决您的问题的方法是在上面示例中设置
req.user=user
,因为您可以访问req对象上路由处理程序中的确切用户,这允许您确定哪个用户已到达路由处理程序。这是使用Passport.js解决的
这使您能够点击诸如req.user之类的字段,该字段返回当前已登录的已验证用户。您需要在会话中保留一些用户信息。我该怎么做?您好,谢谢您的回复。老实说,我只是个新手,还没有完全理解您的意思。请进一步解释一下,您是否使用了express中间件以前?您是如何管理您的登录过程的?您是否以某种方式锁定了路由,以便只有经过身份验证的用户才能访问它们?嘿,伙计们,我已经能够通过使用passport解决这些问题,但是我提出了另一个问题,如果你们都能看看的话。