如何显示用户已经存在的客户端 - MongoDB

Question

我正在使用 MongoDB、NodeJS、ejs、passport 等...

当我尝试使用数据库中已存在的用户名创建新用户时，我收到来自服务器端的错误

{ UserExistsError: 具有给定用户名的用户已经 挂号的 在 Promise.resolve.then.then.then (my/path/for/node_modules/passport-local-mongoose/index.js:238:17) 在 process._tickCallback (internal/process/next_tick.js:68:7) name: 'UserExistsError', message: '具有给定用户名的用户是 已注册'}

并且不要在客户端附加任何消息，只刷新页面并留在主页上，但不知道一个好的方法，我希望客户端知道用户名已经被使用..

谢谢！

我的服务器端：

    const express = require('express'),
    passport = require('passport'),
    User = require('../models/users.js'),

    app = express.Router();


//Get User Data
exports.get_user_data = function(req, res) {

    let userid = req.user._id;

    User.findById(userid)
        .exec((err, user) => {
            if (err) {
                console.log(err);
            } else {
                res.send(user);
            }
        });
}

//Render Register
exports.render_new_register = function(req, res) {

}

//Create New User Account
exports.create_new_account = function(req, res) {

    User.register(new User({
            username: req.body.username,
            companyname: req.body.companyname,
            companyimageURL: req.body.companyimageURL
        }),
        req.body.password,
        (err, user) => {
            if (err) {
                console.log(err);
                return res.redirect('/')
            }
            console.log("SUCCESS");

            logUser(user, req, res);
        }
    )
};

//Render Login
exports.render_login_account = function(req, res) {

};

//Render Logout - end of user session 
exports.render_logout_account_endSession = function(req, res) {
    req.logout();
    res.redirect('/');
};

//Authenticate User Login
exports.user_login_authenticate =
    passport.authenticate("local")


function logUser(user, req, res) {
    req.login(user, (err) => {
        if (err) {
            console.log(err);
            return res.redirect('/');
        }
        res.redirect('/dashboard') //register with success
    })
}

我的客户端

<!-- Modal REGIST SIGNUP-->
<div class="modal fade" id="myModalRegist" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close" style="outline: none; border: none">
                    <span style="outline: none; border: none" aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div id="modal__header" class="container text-center">
                    <h1 class="modal__title">WELCOME</h1>
                    <p class="modal__paragraph"> Create a new account</p>
                    <form action="/getstarted" method="POST">
                        <div class="form-group">
                            <input type="text" class="form-control" aria-describedby="username" placeholder="enter username" name="username" required>
                        </div>
                        <div class="form-group">
                            <input id="passwordregist" type="password" class="form-control" placeholder="min 6 characters" required minlength="6" name="password">
                        </div>
                        <div class="form-group">
                            <input id="passwordregist_confirm" type="password" class="form-control" placeholder="min 6 characters" required minlength="6" name="password_confirm">
                        </div>
                        <div class="form-group">
                            <input type="companyname" class="form-control" placeholder="company name" name="companyname" required>
                        </div>
                        <div class="form-group">
                            <input type="companyimageURL" class="form-control" placeholder="company image URL" name="companyimageURL" required>
                        </div>
                        <div class="form-check">
                            <input type="checkbox" class="form-check-input" required>
                            <label class="form-check-label" for="check">Check me out</label>
                            <div id="alertconfirm"></div>
                        </div>
                        <button id="registersubmitbutton" type="submit" class="btn btn-default button_modal button_modal--colors">Get Started</button>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- / Modal REGIST SIGNUP-->




<script>
    $('#registersubmitbutton').on('click', function(e) {

        let password = $("#passwordregist").val();
        let password_confirm = $("#passwordregist_confirm").val();


        if (password !== password_confirm) {
            if ($('#alertconfirm').children().length === 0) {
                $('#alertconfirm').append(
                    `<div class="alert" role="alert" style="font-size: 11px; color: #ec1818; padding: 0">
                                Oops! Passwords don't match. Please try again.</div>`
                )
            }
            return false;
        }
    });
</script>

Answer 1

如果您想显示一条消息，您可能必须在 click 方法中使用异步调用（我更喜欢创建 onSubmit 方法），您可以使用阿贾克斯。

这是一个如何使用 POST 创建 AJAX 的示例： https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/send#Example_POST.

请记住，响应是对象 xhr.responseText。

xhr.onreadystatechange = function() {
    if(this.readyState == XMLHttpRequest.DONE && this.status == 200) {
        console.log(xhr.responseText);
    }
} 

另一方面，您必须更改 logUser 方法以返回有效的 JSON：

function logUser(user, req, res) {
        req.login(user, (err) => {
            if (err) {
                return res.json({ error: error });
            }
            res.json({ error: null, message: "User registered" });
        })
    }

Answer 2

您可以通过首先检查用户是否存在来实现用户名

例子：

userCtr.create_new_account = (req, res) => {
    const {
      username, companyname, companyimageURL
    } = req.body;

    const query = {
      username: username 
    }

    User.findOne(query)
      .then((user) => {
        if (!user) {
          //create User.
        } else {
          res.status(400).json({ error: 'user already exists' });
        }
      })
      .catch((err) => {
        //return error
      });
  };