Как я могу установить статические учетные данные для входа в мой код в угловых?

Question

Я новичок в angular, и я хотел установить статические значения имени пользователя и пароля, чтобы можно было использовать только это имя пользователя для входа в приложение

Я искал в Интернете и получил несколько решений, но меня смущает то, как я могу реализовать свое приложение

this is the login button in HTML

<button mat-raised-button type="button" color="primary" [disabled]="!form.valid" (click)="loginCheck()">Login</button>

this is the loginCheck()function

loginCheck(){

        if(this.form.valid){
            const userCategory = this.form.value.userCategory;
          const userName = this.form.value.userName;
          const passwd = this.form.value.passwd;

          console.log(userCategory, userName, passwd);

          this._storage.set('IS_LOGGED_IN', true);
          this._authService.isLoggedIn = true;

          this.router.navigate(['admin']);
        }
      }

Я хочу установить статические учетные данные для входа в код, чтобы позволить пользователю войти в систему. По состоянию на сейчас. любой пользователь может ввести любые учетные данные и логин.

Answer 1

Если вы хотите, чтобы ваше имя пользователя и пароль были статическими, сделайте их жестко закодированными.В вашей функции loginCheck файла компонента

loginCheck(){

    if(this.form.valid){
        const userCategory = this.form.value.userCategory;
      const userName = 'admin'; //this.form.value.userName;
      const passwd = 'admin'; //this.form.value.passwd;

      console.log(userCategory, userName, passwd);

      this._storage.set('IS_LOGGED_IN', true);
      this._authService.isLoggedIn = true;

      this.router.navigate(['admin']);
    }
  }

Answer 2

Я бы порекомендовал хранить все статические поля в локальном хранилище в ngOnInit(){} хуке жизненного цикла Angular.

ngOnInit(){
    localstorage.setItem("username","Admin");
    localstorage.getItem("username","Admin");
}


login(){
   let username = localstorage.getItem("username");
   let password = localstorage.getItem("password");
}

Позже, после входа в систему, вы можете удалить эти учетные данные. Более подходящим статическим / тестовым подходом было бы внедрение защиты маршрута, позволяющей входить в систему на основе поддельной валидной JWT, которую вы храните в локальном хранилище.

Answer 3

Во-первых, не очень хорошая идея сделать его статичным.

Во-вторых, если вы все равно хотите это сделать.

после получения значения из формы вы можете проверить как:

userName === 'xyz' && passwd === 'abc

Если вышеуказанное условие выполнено, то только пользователь может войти в систему.

Надеюсь, это отвечает вашим требованиям.