首页 > 解决方案 > 使用 Node.js 和 Nodemailer 在此 Angular 代码中修复此重置密码功能应该做些什么

问题描述

我们正在尝试使用 Node.js 在 Angular 6 中创建重置密码功能。关键是当您单击重置密码并填写您的电子邮件时,它会发送带有重置密码链接的电子邮件。但是电子邮件中的链接没有与 Angular 通信。我们在后端使用 Node.js 和 Node 邮件程序。这是代码:

节点.js

 async ResetPassword(req, res) {
    if (!req.body.email) {
      return res
        .status(HttpStatus.INTERNAL_SERVER_ERROR)
        .json({ message: 'Email is required' });
    }

    const userEmail = await User.findOne({
      email: Helpers.lowerCase(req.body.email)
    });
    if (!userEmail) {
      return res
        .status(HttpStatus.CONFLICT)
        .json({ message: 'Email does not exist' });
    }

      const body = {
        email: Helpers.lowerCase(value.email),

      };
            var resettoken = new resetToken({ _userId: user._id, resettoken: crypto.randomBytes(16).toString('hex') });
            resettoken.save(function (err) {
                if (err) { return res.status(500).send({ msg: err.message }); }
                var transporter = nodemailer.createTransport({
                    service: '"SendGrid"',
                    auth:
                     {
                      user: 'login',
                      pass: 'password'
                     }
                });
                var mailOptions = {
                    from: 'email',
                    subject: 'Node.js Password Reset',
                    text: 'You are receiving this because you (or someone else) have requested the reset of the password for your account.\n\n' +
                      'Please click on the following link, or paste this into your browser to complete the process:\n\n' +
                      'http://' + req.headers.host + '/new-password/' + resettoken + '\n\n' +
                      'If you did not request this, please ignore this email and your password will remain unchanged.\n'
                }

                transporter.sendMail(mailOptions 
                )          
            })

        .catch(err => {
            res
                .status(HttpStatus.INTERNAL_SERVER_ERROR)
                .json({ message: 'Error occured' });
        });
    },

电子邮件模板内的链接无效。

路线

router.post('/new-password', AuthCtrl.NewPassword);

      route.queryParams.subscribe(params => {
        this.form.resetToken = params['token'];
      });
    }


  ngOnInit() {
    this.Init();
  }

  Init() {
    this.ResponseResetForm = this.fb.group(
      {
        email: ['', Validators.required, Validators.email],
        newPassword: ['', Validators.required],
        confirmPassword: ['', Validators.required]
      },
      {
        validator: this.Validate.bind(this)
      }
    );
  }

 ...
...

  ResetPassword() {

    this.authService.newPassword(this.ResponseResetForm.value).subscribe(
      data => {
        this.ResponseResetForm.reset();
        setTimeout(() => {
          this.router.navigate(['sign-in']);
        }, 3000);
      },
      err => {

        if (err.error.message) {
          this.errorMessage = err.error.message;
        }
      }
    );
  }
}

这部分是我从另一个代码中添加的:

 route.queryParams.subscribe(params => {
            this.form.resetToken = params['token'];
          });
        }

但我认为它不适合我们的代码。这里也是这个组件在 Angular 中的路由:

  {
    path: 'response-reset-password',
    component: ResponseResetComponent
  },

我们如何才能使这个后端控制器与 Angular 前端一起按预期工作?

标签: node.jsangularexpressangular6nodemailer

解决方案


因此,当您在电子邮件中嵌入链接时,该链接需要路由到 Angular 前端,而不是后端:

{
   path: 'new-password', // I would suggest changing this path to match your Component. This will also lead to changing the URL being embedded in the ResetPassword email
   component: ResponseResetComponent
}

现在,当用户单击电子邮件中的链接时,将加载前端,然后您可以在后端处理token实际将ResponseResetComponent请求发送到:router.post('/new-password')


推荐阅读