TypeError: Cannot read properties of undefined (reading 'length')错误排查求助

问题描述 #

实现用户注册接口时，持续抛出TypeError: Cannot read properties of undefined (reading 'length')错误，错误指向代码第66行的if(pass1.length < 6)语句。接口预期功能为用户填写信息后将数据存入数据库，但始终触发该错误。

相关代码：

const userRegistrationPost = (req, res) => {
    const{name, email, pass1, pass2} = req.body;

        let errors = [];

        if(!name|| !email || !pass1 || !pass2){
            errors.push({msg: "Please ensure all fields are filled"});
        }

        if(pass1 !==pass2){
            errors.push({msg: "Passwords don't match"});
        }
        
        if(pass1.length < 6){   //line 66
            errors.push({msg: "Passwords must be at least 6 characters"});
        }

        if(errors.length > 0){
            res.render("user_registration", {errors, name, email, pass1, pass2})
        }else{
        //WE DON'T WANT TO HAVE 2 USERS WITH THE SAME EMAIL
            User.findOne({email: email})
            .then((result)=> {
                if(result){
                    errors.push({msg: "Email already exists"});
                    res.render("user_registration", errors, name, email, pass1, pass2)
                }else{
                    //HERE WE TRY TO ENCRYPT OUR PASSWORD
                    bcrypt.hash(pass1, 10, (error, hash)=>{
                        const nUser = new User({
                            name, email, password: hash,
                        })
                        try{
                            nUser.save();
                            req.flash('message', "Registration Successful. You can now Signup")
                            res.redirect('/user_login');
                        }
                        catch(err){
                            req.flash('error_msg', "Could not save into the Database");
                            res.redirect('user_registration');
                        }
                    })
                }
            })
            .catch((err)=> {
                res.send("There's a problem");
                console.log(err);
            })
        }
}

问题定位 #

错误核心原因是：当pass1为undefined时，代码仍会执行到pass1.length < 6这一行。虽然开头检查了必填项并添加了错误信息，但没有终止后续逻辑，导致undefined的pass1被读取length属性，触发类型错误。

同时代码还存在两个隐性问题：

• 邮箱已存在分支中，res.render参数格式错误（应传递对象而非多个独立参数）
• 注册成功提示文案逻辑错误（"You can now Signup"应改为"You can now Login"）

解决方案 #

1. 添加校验拦截 #

在必填项检查后，若存在错误则直接终止函数执行，避免后续无效校验：

// 检查必填项
if (!name || !email || !pass1 || !pass2) {
    errors.push({ msg: "Please ensure all fields are filled" });
}

// 若已有错误，直接渲染错误页面并终止函数
if (errors.length > 0) {
    res.render("user_registration", { errors, name, email, pass1, pass2 });
    return; // 终止后续代码执行
}

2. 修复res.render参数错误 #

将邮箱已存在分支中的res.render参数改为对象格式：

if (result) {
    errors.push({ msg: "Email already exists" });
    res.render("user_registration", { errors, name, email, pass1, pass2 }); // 修正为对象参数
}

3. 完善加密错误处理与提示文案 #

添加密码加密的错误捕获，同时修正注册成功的提示文案：

bcrypt.hash(pass1, 10, (error, hash) => {
    // 添加加密错误处理
    if (error) {
        req.flash('error_msg', "Could not encrypt password");
        return res.redirect('user_registration');
    }
    const nUser = new User({
        name,
        email,
        password: hash,
    });
    try {
        nUser.save();
        // 修正提示文案
        req.flash('message', "Registration Successful. You can now Login");
        res.redirect('/user_login');
    } catch (err) {
        req.flash('error_msg', "Could not save into the Database");
        res.redirect('user_registration');
    }
});

修复后完整代码 #

const userRegistrationPost = (req, res) => {
    const { name, email, pass1, pass2 } = req.body;

    let errors = [];

    // 检查必填项
    if (!name || !email || !pass1 || !pass2) {
        errors.push({ msg: "Please ensure all fields are filled" });
    }

    // 拦截错误，避免后续undefined报错
    if (errors.length > 0) {
        res.render("user_registration", { errors, name, email, pass1, pass2 });
        return;
    }

    // 密码匹配校验
    if (pass1 !== pass2) {
        errors.push({ msg: "Passwords don't match" });
    }

    // 密码长度校验（此时pass1已确保存在）
    if (pass1.length < 6) {
        errors.push({ msg: "Passwords must be at least 6 characters" });
    }

    if (errors.length > 0) {
        res.render("user_registration", { errors, name, email, pass1, pass2 });
    } else {
        User.findOne({ email: email })
            .then((result) => {
                if (result) {
                    errors.push({ msg: "Email already exists" });
                    res.render("user_registration", { errors, name, email, pass1, pass2 });
                } else {
                    bcrypt.hash(pass1, 10, (error, hash) => {
                        if (error) {
                            req.flash('error_msg', "Could not encrypt password");
                            return res.redirect('user_registration');
                        }
                        const nUser = new User({
                            name,
                            email,
                            password: hash,
                        });
                        try {
                            nUser.save();
                            req.flash('message', "Registration Successful. You can now Login");
                            res.redirect('/user_login');
                        } catch (err) {
                            req.flash('error_msg', "Could not save into the Database");
                            res.redirect('user_registration');
                        }
                    });
                }
            })
            .catch((err) => {
                res.send("There's a problem");
                console.log(err);
            });
    }
};

内容的提问来源于stack exchange，提问作者Akinsola Oluwatamilore