电子邮件验证令牌作为来自 URL 的请求参数答案

【问题标题】：Email Validation Token as Request Parameter from URL电子邮件验证令牌作为来自 URL 的请求参数
【发布时间】：2020-02-13 06:58:44
【问题描述】：

我创建了一个表单，我想用它来重置密码。后端部分已经完成，在前端我认为必须发回验证令牌。你能告诉我这是如何工作的吗？

我的代码如下所示：

 // login.service.ts
  resetPassword(loginUser: Login) {
    return this.http.post<any>(`${environment.baseUrl}/set-password`, loginUser, {
      headers: new HttpHeaders({
        'Content-Type': 'application/json'
      })
    }).pipe(map(data => data)); }

// reset-password.component.ts
  submitNewPassword() {
    this.submitted = true;

    //  stop here if form is invalid
    if (this.rpForm.invalid) {
      return;
    }
    const successText = 'Ihr Passwort wurde erfolgreich zurückgesetzt!';
    const errorText = 'Ihr Passwort konnte nicht zurückgesetzt werden!';
    this.rpAlertType = null;
    this.rpMessage = null;
    this.loginService.resetPassword(this.rpForm.value)
      .subscribe(
        data => {
          console.log('Password will be set!', data);
          this.submitted = false;

          if (data.success) {
            this.rpAlertType = 'success';
            this.rpMessage = successText;
          } else {
            this.rpAlertType = 'error';
            this.rpMessage = errorText;
          }
        },
        error => {
          this.submitted = false;
          this.alertType = 'error';
          this.rpMessage = errorText;

ngOnInit() {
    // Reset password form
    this.rpForm = this.formBuilder.group( {
      password: ['', Validators.pattern('^(?=.*[0-9])(?=.*[!@#$%^&*])[a-zA-Z0-9!@#$%^&*]{8,}$')],
      confirm_password: ['', Validators.required]
    });
  }

【问题讨论】：

标签： angular validation httprequest frontend token

【解决方案1】：

试试这个代码。它会帮助你！

    import { Router, ActivatedRoute } from '@angular/router' 
    export class GuestEventComponent implements OnInit {
     Id;
     constructor(private route: ActivatedRoute){

    this.route.params.subscribe(params => {
    this.Id = params.id; // put your route file parameter insted of id
    console.log("ID", this.ID);

    })

   }

}

【讨论】：

功能不受影响。为什么我必须在 LocalStorage 中写入？我需要一个resetToken，我必须将它传递给后端。还是我误解了什么？
什么是验证令牌？我想你传递了 jwt 令牌，所以我给出了答案。你能告诉我你的函数中使用的验证令牌，所以我可以给出另一个解决方案。
我认为我没有详细解释我的问题。我创建了一个用户可以设置新密码的区域。在表单中有一个密码和确认密码的输入字段。我想我需要设置一个resetToken，这应该发送到后端。目前我在控制台中收到错误缺少参数！
在控制台中：邮件响应 {success: false, errorMessage: "missing params!"}errorMessage: "missing params!"success: false__proto__: Object
在后端：userentity0_.email_validation_code='null'

【解决方案2】：

我解决了这个问题。

这是我的代码，适用于那些遇到同样问题并感到绝望的人 xD

如何重设密码？

1.) 创建一个 login.service.ts 并添加函数：

resetPassword(resetPasswordValues: { password: string, token: string }) {
    return this.http.post<any>(`${environment.baseUrl}/your-api`, resetPasswordValues, {
      headers: new HttpHeaders({
        'Content-Type': 'application/json'
      })
    }).pipe(map(data => data)); }
}

2.) 将代码粘贴到您的 reset-password.component.ts：

private token: string;

ngOnInit() {
// Send token
    this.token = this.route.snapshot.queryParamMap.get('token');
}

// Set new password
  submitNewPassword() {
this.loginService.resetPassword({ password, token: this.token})
}

【讨论】：