asp.net 无法从前端到后端获取模型中的数据ASP Web APIAngular

xghobddn 于 2022-11-19 发布在 .NET

关注(0)|答案(2)|浏览(151)

我试图从一个有Angular 的前端登录到一个ASP.net API后端，但是当我试图在请求中给予带有电子邮件和密码的数据模型时，它没有到达后端，而命名是完全相同的。
下面是我在ASP中的终结点：

[Route("/[controller]/Login")]
        [HttpPost]

    public async Task<IActionResult> Login(LoginForm loginForm)

下面是我在ASP中创建的类LoginForm：

public class LoginForm
    {
        [Required]
        public string Email { get; set; }
        [Required]
        public string Password { get; set; }

    }

下面是我的请求代码在Angular ：

login(model: LoginForm) {

    console.log(model);

    return this.http.post(this.authUrl + "Login" , model, {}).pipe(
      map((response: any) => {
        const user = response;

        if (user.result.accountID > 0) {
          localStorage.setItem("token", user.token);
          this.decodedToken = this.helper.decodeToken(user.token);
        }
      })
    );
  }

下面是我在Angular中的LoginForm类：

export interface LoginForm {
    Email: string;
    Password: string;
}

下面是我试用时的控制台日志：

{Email: 'test', Password: 'test'}

这是我试用时从网络收到的请求负载：

{Email: "test", Password: "test"}
Email
: 
"test"
Password
: 
"test"

它确实到达后端，但模型只是没有填充，见下图：

asp.net

来源：https://stackoverflow.com/questions/74473490/cant-get-data-in-model-from-frontend-to-backendasp-web-api-angular

2条答案

按热度按时间

2vuwiymt1#

我不知道ASP是如何工作的，但我知道Angular。
当你用Angular调用Backend时，你需要订阅Observable以获取数据。

this.http.get<any>(this.apiURL + "/Login").subscribe(response => {
        console.log(response);
    })

如果你想处理一些错误，你可以这样做。

this.http.get<any>(this.apiURL + "/Login").subscribe(response => {
        console.log(response);
    },
    (error) => {
        console.error(error);
        switch(error.status){
            case 404:
                // 404 code
                break;
            case 500:
                // 500 code
                break;
            default : 
                break
        }
    })

赞(0）回复(0）举报 2022-11-19

zlwx9yxi2#

请确保使用“Content-Type”传递标头选项：'应用程序/json'，

这是用于发布登录表单数据的登录服务

header() {
          return new HttpHeaders({
            'Content-Type': 'application/json',
          });
        }

        // ----------------------------- LOGIN -----------------------------
        login(model: LoginForm): Observable<any> {
          return this.http.post(this.ApiURL + 'Account/Login', model, { headers: this.header()})
            .pipe(
              map((response: any) => {
                if (response) {
                  this.authService.setUserName(response.userName);
                  this.authService.setAccessToken(response.accessToken);
                  this.authService.setRefreshToken(response.refreshToken);
                  this.authService.setAssignedMenu(response.menuList);
                }
              })
            );
        }

以下是C#登录方法

[Route("Login")]
    [HttpPost]
    public async Task<IActionResult> Login(LoginViewModel loginViewModel)
    {}

赞(0）回复(0）举报 2022-11-19

我来回答

asp.net 无法从前端到后端获取模型中的数据ASP Web APIAngular

2条答案

请确保使用“Content-Type”传递标头选项：'应用程序/json'，

这是用于发布登录表单数据的登录服务

以下是C#登录方法

相关问题

热门标签

最新问答