反应管理路由

Question

我正在尝试制作我的第一个只有一个管理员的网站，一旦该管理员登录该网站就会显示“管理员”按钮，当管理员点击它时它将转到此路径 shopMembers/adminProfile .这里的问题是所有网站的成员都可以进入 adminProfile，如果他们登录并在浏览器的搜索框中输入 shopMembers/adminProfile。

shopUsers-routes.js

.
.
router.get('/adminProfile',  isAuthenticated, (req, res)=>{
    res.render('shopMembers/adminProfile', {
            success: req.flash('success')
    })
})
.
.

navbar.ejs

.
.
<% if ((user) && (user.email == "abodn70@hotmail.com")) {%>
                       
  <li><a href="/shopUsers/adminProfile" id="admin" style="color:red">Admin</a></li>
  <% }%>
.
.

通过-Suser.js

const passport = require('passport')
const localStrategy = require('passport-local').Strategy
const SUser = require('../models/shopUser')


//saving user object in the session 
passport.serializeUser(function(user, done) {
    done(null, user.id);
  });
  
  passport.deserializeUser(function(id, done) {
    SUser.findById(id, function(err, user) {
      done(err, user);
    });
  });

// user signup
passport.use('local.signup', new localStrategy({
    usernameField : 'email',
    passwordField: 'password',

    passReqToCallback: true
}, (req,username,password, done)=> {
    if (req.body.password != req.body.confirm_passwordUS) {
        return done(null, false, req.flash('error', 'Passwords not match'))
    } else {
        SUser.findOne({email: username}, (err,user)=>{
            if (err){
                return done(err)
            }
            if (user){
                return done(null, false, req.flash('error', 'Email already used'))
            }
            if (!user){
                //Creat user
                
                let newUser = new SUser()
                newUser.email= req.body.email,
                newUser.password= newUser.hashPassword(req.body.password),
                newUser.firstName= req.body.Fname,
                newUser.lastName= req.body.Lname,
                newUser.userName= req.body.UserName

              //  newUser.avatar= "user.png"
                newUser.save((err, user)=>{
                    if(!err){
                        console.log(newUser)
                        return done(null, user, req.flash('success', 'User Added'))
 
                    }
                    else{
                        console.log(err)
                    }

                })
            }
        }  )
    }

}))

//user login

passport.use('local.login', new localStrategy({
    usernameField : 'email',
    passwordField: 'password',
    passReqToCallback: true

},(req, username, password, done)=>{
    // find user
    SUser.findOne({email: username}, (err,user)=> {

        if (err) {
            return done(null, false, req.flash('error', 'Something wrong happened'))
        } 
        if(!user) {
            return done(null, false, req.flash('error', 'user was not found'))
        }
   //     if(!user.confirmed){
   //         return done(null, false, req.flash('error', 'user has not confirmed the account'))
  //      }
        if (user) {
            if (user.comparePasswords(password, user.password)) {

                return done(null,user, req.flash('success', ' welcome back'))

            } else {
                return done(null,false, req.flash('error', ' password is wrong'))

            }
        }
    })
}))

app.js

const express = require("express");
const app = express()
const db = require ('./config/database.js') //connect to database
var bodyParser = require('body-parser')
const session= require('express-session')
const flash= require('connect-flash')
const passport = require("passport");
const pSU = require('./config/pass-Suser') 
const router = express.Router();

.
.
.
//session and flash config
app.use(session({
  secret: 'keyboard cat',
  resave: false,
  saveUninitialized: true,
  cookie: { maxAge: 60000 *15  }
}))
app.use(flash())

//bring passport 
app.use(passport.initialize())
app.use(passport.session())

// store user object
app.get('*', (req,res,next)=> {
  res.locals.user = req.user || null
  next()
})
.
.

Answer 1

如您所见，在前端隐藏 link 毫无意义。您需要在服务器上实现权限逻辑。我有一段时间没有使用 Passport（现在的 Meteor 可以很好地处理这个问题），但是像这样的东西应该可以工作：

app.get('/shopUsers/adminProfile', (req, res, next)=> {
  if (req.user.email != 'abodn70@hotmail.com') {
    // disallowed
    res.sendError(401);
  } else {
    next();
  }
});

反应管理路由

React Admin routing

ejs

node.js

reactjs