用户无需在 Angular 8 中提供凭据即可登录

如何解决用户无需在 Angular 8 中提供凭据即可登录

我正在构建一个应用程序，该应用程序使用 Angular 8 作为前端，使用 Spring Boot 作为后端。我目前正在研究登录和注册组件。我已经使用 Spring Boot 和 MysqL 数据库创建了后端 api。我在 Spring Boot 中使用 POST 方法注册了两个用户，并且它们在数据库中可用。现在我在登录中使用它们并尝试登录，但我的登录似乎接受空值和随机值。我哪里出错了？我已经检查了邮递员中的所有api。由于我是 angular 的新手，我无法调试它。任何帮助或参考将不胜感激。

admin-login.component.html:

<mat-card class="admin-login">
    <mat-card-header class="login-header">
        <mat-card-title>Admin Login</mat-card-title>
    </mat-card-header>
    <mat-card-content class="content"> 
        <form class="admin-login-form" (ngSubmit)="loginUser()">
            <small class="alert">{{ message }}</small>
            <table>
                <tr>
                    <td>
                        <mat-form-field class="admin-user-name">
                            <input matInput placeholder="Email ID" [(ngModel)]="user.emailId" name="emailId" type="email" required>
                        </mat-form-field>
                    </td>
                </tr>

                <tr>
                    <td>
                        <mat-form-field class="admin-password">
                            <input matInput placeholder="Password" [(ngModel)]="user.password" type="password"
                                name="password" required>
                        </mat-form-field>
                    </td>
                </tr>
            </table>
        </form>
    </mat-card-content> 
    <mat-card-actions class="action">
        <button mat-raised-button type="submit" (click)="loginUser()" color="primary">Login</button>
    </mat-card-actions>
    <a class="register" mat-menu-item routerLink="/adminRegistration">Register</a>
</mat-card>

admin-login.component.ts:

import { LoginService } from './../../login.service';
import { Component,OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { User } from 'src/app/user';


@Component({
  selector: 'app-admin-login',templateUrl: './admin-login.component.html',styleUrls: ['./admin-login.component.css']
})
export class AdminLoginComponent implements OnInit {

  user = new User();
  message= '';

  constructor(private router: Router,private service: LoginService) { }

  
  ngOnInit(): void {
  }

  loginUser() {
    this.service.loginUserFromremote(this.user).subscribe(
      data => { console.log("Success"),this.router.navigate(['/admin'])
              },error => { console.log("Failure"),this.message = "Invalid credentials";
            }
    )

  }


}

登录.service.ts：

import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs';
import { User } from './user';

@Injectable({
  providedIn: 'root'
})
export class LoginService {
  user: any;

  constructor(private http: HttpClient) { }

  public loginUserFromremote(user: User): Observable<any> {
    return this.http.post<any>("http://localhost:8080/admin/login",user)

  }

  public registerUserFromremote(user: User): Observable<any> {
    return this.http.post<any>("http://localhost:8080/admin/register",user)

  }
}