Cannot set headers after they are sent to the client - Entries saved to MongoDb - Express.Js

Question

I know this question gets asked a lot but I cannot tell where I am sending multiple headers. The data is getting stored in the database and then it crashes. I am fairly new to Node/Express and I think I might be missing something fundamental here.

I have tried reading what I could find on stackoverflow and figured out the reason I am getting this error is because it is sending multiple header requests. Tried updating the code with little tweaks but nothing has worked so far.

Thanks for the help.

Dashboard Controller -

exports.getGymOwnerMembersAdd = (req, res, next) => {
    let message = req.flash('error');
    if(message.length > 0) {
        message = message[0];
    } else {
        message = null;
    }
    const oldInput = {
      ...
    };

    Membership
        .find()
        .then(memberships => {
            res.render('gym-owner/members-add', {
                memberships: memberships,
                oldInput: oldInput,
                errorMessage: message,
                pageTitle: 'Add Members',
                path: '/gym-owner-dashboard/members-add',
                validationErrors: []
            });
        })
        .catch(err => {
            console.log(err);
        });
}

exports.postGymOwnerMembersAdd = (req, res, next) => {
    const membershipId = req.body.membershipLevel;
    const errors = validationResult(req);
    let message = req.flash('error');

    if(message.length > 0) {
        message = message[0];
    } else {
        message = null;
    }

    if(!errors.isEmpty()) {
        Membership
            .find()
            .then(memberships => {
                return res.status(422).render('gym-owner/members-add', {
                    pageTitle: 'Add Members',
                    path: '/gym-owner-dashboard/members-add',
                    errorMessage: errors.array()[0].msg,
                    message: message,
                    memberships: memberships,
                    oldInput: { 
                        ...
                    },
                    validationErrors: errors.array()
                });
            })
            .catch(next);
    }

    bcrypt
        .hash(password, 12)
        .then(hashedPassword => {
            const user = new User({
                ...
            });
            return user.save();
        })
        .then(result => {
            res.redirect('/gym-owner-dashboard/members');
        })
        .catch(err=> {
            console.log(err);
        });
}

Dashboard Routes And Validation-

router.get('/gym-owner-dashboard/members-add', isAuth, isGymOwner, dashboardController.getGymOwnerMembersAdd);
router.post(
    '/gym-owner-dashboard/members-add',
    isAuth, isGymOwner, 
    [
        check('name')
            .isAlpha().withMessage('Names can only contain letters.')
            .isLength({ min: 2 }).withMessage('Please enter a valid name')
            .trim(),
        check('email')
            .isEmail().withMessage('Please enter a valid email.')
            .custom((value, { req }) => {
                return User.findOne({
                    email: value
                }).then(userDoc => {
                    console.log('Made it here!');
                    if(userDoc) {
                        return Promise.reject('E-mail already exists, please pick a different one.');
                    };
                });
            })
            .normalizeEmail(),
        ...
        check(
            'password',
            'Please enter a password at least 5 characters.'
        )
            .isLength({ min: 5 })
            .trim(),
        check('confirmPassword')
            .trim()
            .custom((value, { req }) => {
                if(value !== req.body.password) {
                    throw new Error('Passwords have to match!');
                }
                return true;
            })
    ], 
    dashboardController.postGymOwnerMembersAdd
);

Expected Results Create a new user while passing validation.

Actual Results A new user is created and saved to Mongodb. The user gets redirected back to the user creation page with an error that the user is undefined. The server crashes with the error "Error [ERR_HTTP_HEADERS_SENT]: Cannot set headers after they are sent to the client"

Answer 1

I understand you have a bug in "postGymOwnerMembersAdd".

    if(!errors.isEmpty()) {
        Membership
            .find()
            .then(memberships => {
                return res.status(422).render('gym-owner/members-add', { // this return refers to cb but not to middleware
                    pageTitle: 'Add Members',
                    path: '/gym-owner-dashboard/members-add',
                    errorMessage: errors.array()[0].msg,
                    message: message,
                    memberships: memberships,
                    oldInput: { 
                        ...
                    },
                    validationErrors: errors.array()
                });
            })
            .catch(next);
    }

    bcrypt
        .hash(password, 12)
        .then(hashedPassword => {
            const user = new User({
                ...
            });
            return user.save();
        })
        .then(result => {
            res.redirect('/gym-owner-dashboard/members');
        })
        .catch(err=> {
            console.log(err);
        });

Thus, both the "return res.status(422).render()" and the "res.redirect('/gym-owner-dashboard/members')" will be executed, and this trigger error (header set after they are sent).
I mean two solutions to the problem First: use async/await

exports.postGymOwnerMembersAdd = async (req, res, next) => {
  const membershipId = req.body.membershipLevel;
  const errors = validationResult(req);
  let message = req.flash('error');

  if(message.length > 0) {
    message = message[0];
  } else {
    message = null;
  }

  if(!errors.isEmpty()) {
    try {
      const memberships = await Membership.find();
      return res.status(422).render('gym-owner/members-add', {
        pageTitle: 'Add Members',
        path: '/gym-owner-dashboard/members-add',
        errorMessage: errors.array()[0].msg,
        message: message,
        memberships: memberships,
        oldInput: {
          ...
        },
        validationErrors: errors.array()
      };
    } catch (err) {
      next(err);
    }
  }

  const hashedPassword = await bcrypt.hash(password, 12);
  const user = new User({
    ...
  });
  await user.save();
  return res.redirect('/gym-owner-dashboard/members');
};

Second: use else

exports.postGymOwnerMembersAdd = (req, res, next) => {
  const membershipId = req.body.membershipLevel;
  const errors = validationResult(req);
  let message = req.flash('error');

  if(message.length > 0) {
    message = message[0];
  } else {
    message = null;
  }

  if(!errors.isEmpty()) {
    Membership
      .find()
      .then(memberships => {
        return res.status(422).render('gym-owner/members-add', {
          pageTitle: 'Add Members',
          path: '/gym-owner-dashboard/members-add',
          errorMessage: errors.array()[0].msg,
          message: message,
          memberships: memberships,
          oldInput: {
            ...
          },
          validationErrors: errors.array()
        });
      })
      .catch(next);
  } else {
    bcrypt
      .hash(password, 12)
      .then(hashedPassword => {
        const user = new User({
          ...
        });
        return user.save();
      })
      .then(result => {
        res.redirect('/gym-owner-dashboard/members');
      })
      .catch(err=> {
        console.log(err);
      });
  }
}