in

mecanografiado: cómo navegar a la página de inicio desde el inicio de sesión después de iniciar sesión correctamente con credenciales en angular

apple touch icon@2

En mi aplicación angular, tengo los datos json con credenciales de usuario que se crean como archivo .json en la aplicación angular como

usercredentials.json



[
    {
        "name": "Admin",
        "permission": "all",
        "password": "Admin"
    },
    {
      "name": "MyName",
      "permission": "none",
      "password": "test"
    }
]

navegará a la página de inicio solo si las credenciales son correctas (es decir, nombre de usuario: Admin y contraseña: Admin)

auth.service.ts

export class AuthService {

  private httpOptions: any;
  public profile: any;
  public username: string;
  public password : any;
  public usr :any;

  constructor(private http: HttpClient, private router: Router) { }

  
  login(username: string, password: string): Observable<any> {
    
    return this.http.post('./app/usercredentials.json', { username, password })

  }
}

login.component.ts

constructor(private ds: AuthService, private http: HttpClient, private router: Router) { }

  public userinfo: any = [];
  public name:string;
  public password:any;
  public username :string;
  public user : any;
  
  ngOnInit(): void {
this.ds.login(this.username,this.password)
      .subscribe((userinfo) => {
        this.userinfo = userinfo;

        console.log('obj', this.userinfo);
        this.name = this.userinfo.name;
        this.password = this.userinfo.password;
        localStorage.setItem('user',this.name);
        localStorage.setItem('passwrd',this.password);
        if(localStorage.getItem('user')){
          this.router.navigate(['/home']);

        }

      },

        err => {
          console.log("Error", err)
        }
      );


  }

login.component.html

 <form>
        <input type="text" id="login" class="fadeIn second" name="uname" placeholder="Username" ><br>
        <input type="password" id="password" class="fadeIn third" name="pw" placeholder="Password" ><br><br>
        <input type="submit" class="fadeIn fourth" value="Submit">
      </form>

Mi requisito es … Navegar a la página de inicio después de la autenticación exitosa y, si el intento de inicio de sesión no tuvo éxito, mostrar un mensaje de error.

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Estadística: distribución de probabilidad geométrica

nnNYDGiNrauvLh4h5LKQ3n 1200 80

Códigos de regalo misteriosos de Pokemon Sword and Shield: todos los códigos para canjear por regalos gratis