angular - Angular2 (finálna verzia) a Firebase autentifikácia nie sú trvalé


Pracujem na prihlasovacej stránke, viem sa prihlásiť a všetko funguje perfektne, ale kedykoľvek obnovím webovú stránku, musím sa znova prihlásiť a zadať svoje prihlasovacie údaje. Prihlásenie nie je trvalé. Tu je môj kód:

auth.guard.ts

import { Injectable } from "@angular/core";
import { CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, Router } from "@angular/router";
import { AuthService } from "./auth.service";
import { Observable } from "rxjs/Rx";

@Injectable()
export class AuthGuard implements CanActivate {
    constructor(private authService: AuthService, private router: Router) {}
    canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
        let url: string = state.url;
        return this.checkLogin(url);
    }

    checkLogin(url: string): boolean {
        if (this.authService.isAuthenticated()) { return true; }

        // Store the attempted URL for redirecting
        this.authService.redirectURL = url;

        // Navigate to the login page if the user access Guarded pages
        this.router.navigate(['/signin']);
        return false;
    }
}

auth.service.ts

import { Injectable } from "@angular/core";
import {Router} from "@angular/router";
import { User } from "./user.interface";
declare var firebase: any;

@Injectable()
export class AuthService{
  constructor(private router: Router) {}
    redirectURL: string;
  signupUser(user: User) {
    firebase.auth().createUserWithEmailAndPassword(user.email, user.password)
        .then(() => {
            this.router.navigate(['/home']);
        })
        .catch(function (error) {
            document.getElementById("error").textContent = error.message;
        });
  }

  signinUser(user: User) {
      firebase.auth().signInWithEmailAndPassword(user.email, user.password)
          .then (() => {
              this.router.navigate(['home'])
          })
          .catch(function (error) {
              console.log(error)
          });
  }

  logout() {
    firebase.auth().signOut();
    this.router.navigate(['/signin']);
  }

  isAuthenticated() {
    var user = firebase.auth().currentUser;
      return !!user;
  }
}

Login.component.ts

import { Component, OnInit } from '@angular/core';
import {FormGroup, Validators, FormBuilder} from "@angular/forms";
import {CustomValidators} from "../validators/email.validator";
import {PasswordValidator} from "../validators/password.validator";
import {AuthService} from "../services/auth.service";

@Component({
  selector: 'neutron-sign-up',
  templateUrl: './sign-up.component.html',
  styleUrls: ['./sign-up.component.css']
})
export class SignUpComponent {
  myForm: FormGroup;

  constructor(private authService: AuthService) {}

  onSignup() {
    this.authService.signupUser(this.myForm.controls['SignUpForm'].value);
  }
}

Prihlásenie.component.html

<div class="container">
  <form class="div" [formGroup]="myForm" novalidate (ngSubmit)="onSignup()" autocomplete="off">
    <div formGroupName="SignUpForm" class="form-group">
      <div class="form-group">
        <label for="email">Email</label>
        <input formControlName="email" type="email" class="form-control" id="email" name="email">
        </div>
      </div>
      <div id="error"></div>
      <label for="password">Password</label>
      <input type="password" class="form-control" formControlName="password" id="password" name="password">
    <div formGroupName="SignUpForm" class="form-group">
      <label for="confirmPassword">Retype password</label>
      <input formControlName="confirmPassword" type="password" class="form-control" id="confirmPassword" name="confirmPassword">
    </div>
    <button type="submit" [disabled]="!myForm.valid" class="btn btn-default">Submit</button>
  </form>
</div>

Mám svoju konfiguráciu Firebase v App.module.ts. Vyhľadával som na webovej stránke Firebase informácie o perzistencii, ale nenašiel som žiadne informácie o tom.

Ak by sa niekto mohol pozrieť na môj kód, prosím. Ďakujem!

Odpoveď č. 1

Môžete použiť AngularFire, ktorý sa implementuje oveľa jednoduchšie. Stačí postupovať podľa nastavenia tu. Na kontrolu, či je používateľ overený, je môj kód

   import { AngularFire,AuthProviders,AuthMethods } from 'angularfire2';
    ....
   public isLoggedIn:boolean=false;
   constructor(public af: AngularFire){}
    ....
     isAuthenticated(){
      this.af.auth.subscribe(auth =>{

     if(auth){
       return this.isLoggedIn=true;
     }
       return  this.isLoggedIn=false;
   })

Na prihlásenie môžete použiť toto

login(userName:string,password:string) {
    this.af.auth.login({ email: userName, password:password },{
  provider: AuthProviders.Password,
  method: AuthMethods.Password,
  }).then(()=>{
       console.log("logging in...");
       this.router.navigate(['home']);
    })
    .catch( error => console.log(error.message));

  }

Toto pre mňa funguje a som len začiatočník v ng2. Dúfam, že to pomôže.