当我将电子邮件放入有效负载时，Angular 代理出错

Posted 2023-02-22

【中文标题】当我将电子邮件放入有效负载时，Angular 代理出错

【英文标题】：Angular proxy got error when I put email in payload

【发布时间】：2021-11-28 13:49:30

【问题描述】：

我使用 Angular 开发重置密码模块，我需要先发送电子邮件到后端进行验证。我使用代理向后端发送 API 请求，以下是我的代理设置：

"/api": 
    "target": "http://localhost:3000",
    "secure": false,
    "changeOrigin": true
  

然后我发现这个API请求总是出现以下错误，即使后端已经收到了这个电子邮件验证请求并完成了处理。 （只有这个 api 请求，其他工作正常）有人可以帮助解决这个问题吗？

[HPM] Error occurred while trying to proxy request /api/reader/verifyemail from localhost:4200 to http://localhost:3000 (ECONNRESET) (https://nodejs.org/api/errors.html#errors_common_system_errors)

以下是我的组件代码 - 调用 API 部分：

submitEmail() 
    const val = this.email.value; //email value from input element
    this.readerService.verifyEmail( email: val ).subscribe((data) => 
      if (data) 
        this.logger.info(`Email validation success for reader $data`);
        this.readerService.sendResetEmail(val).subscribe((data) => 
          if (data) 
            window.alert('Please check your email and follow it to reset the password');
            this.router.navigateByUrl('/reader/login');
          
        )
       else 
        this.logger.warn('Email validation failed');
        window.alert('No account is associated with this email')
      
    )
  

以下是我在前端的 API 服务：

verifyEmail(input: emailDto): Observable<any> 
    return this.http.post('/api/reader/verifyemail', input).pipe(
      catchError(this.handleError('verifyEmail')), shareReplay()
    )
  

后端 API 部分应该没问题，因为我测试了包括发送重置电子邮件在内的所有内容都可以正常工作。它们的返回值要么是 json 对象，要么是 null，就像我的其他 API 一样。 非常感谢！

【参考方案1】：

找到原因了，因为我的html文件问题，我使用FormBuild而不是FormControls重新定义表单，错误消失了。