Функциональность кнопки выхода из системы в среднем стеке, как сделать истечение сеанса? - PullRequest
Новая
       12

Функциональность кнопки выхода из системы в среднем стеке, как сделать истечение сеанса?

0 голосов
/ 13 апреля 2020

Я работал над проектом в качестве стажера, и я новичок в стеке. Это проблема, с которой я сталкиваюсь, меня попросили создать страницу входа в систему, которая завершена, но выгода заключается в том, что вход в систему аутентифицирован компанией сторона . Так что в основном в моем компоненте входа в систему я реализовал следующую логику c. Компонент файла login.component.ts выглядит следующим образом: 

onSubmit(event) {
    event.preventDefault()
    console.log('value',this.loginForm.value)

    if(this.errorMail.length === 0) {
      this.loginService.login(this.loginForm.value).subscribe((res:any) => {
        console.log('login response', res)
        if(res.auth.success === true) {
          localStorage.setItem('auth', JSON.stringify(res.auth))
          this.loginService.loggedIn$.next(res.auth)
          this.router.navigateByUrl('/search/list')
        } else {
        this.errorMail='Email or password is not valid'
        }
      })
    }

, это login.service.ts 

import { Injectable } from '@angular/core';
import {HttpClient} from '@angular/common/http'
import { BehaviorSubject } from 'rxjs';

interface LoginResponse {
  success: boolean
}

@Injectable({
  providedIn: 'root'
})

export class LoginService {

  constructor(private http: HttpClient) { }
  loggedIn$ = new BehaviorSubject(null)
login(creds) {
    // console.log('creds',creds)
   return this.http.post<LoginResponse>('url-of-company', {creds})
  }

и в моем компоненте заголовка, где у меня есть кнопка выхода из системы: содержимое header.component.ts; 

import { Router } from '@angular/router';
import { Component, OnInit } from '@angular/core';
import { HeaderService } from './header.service';

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

  constructor(public authService: HeaderService,public router:Router) { }
  onLogout(){
    this.authService.logout();
this.router.navigateByUrl('/');
  }

authService в приведенном выше коде импортируется из header.service.ts, а header.service.ts выглядит так: 

import { LoginService } from './../../login/login.service';
import { Injectable } from '@angular/core';
import {HttpClient} from '@angular/common/http'
import { Router } from '@angular/router';

interface LoginResponse {
  success: boolean
}

export class HeaderService{

  constructor(private router: Router,private http: HttpClient,private user:LoginService) {}
 logout() {
    this.http.delete<LoginResponse>('url-of-comapy');
    this.router.navigate(['/']);
  }

В основном я пытаюсь удалить кредиты аутентификации, которые я получаю от URL-адреса компании, и перенаправляет его на страницу входа

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

1 Ответ

0 голосов
/ 13 апреля 2020

Я думаю, вам нужно удалить кредиты из localStorage, а не из базы данных, что вы пытаетесь сделать в приведенном выше коде в функции logout().

Вам не нужно logout() функция в authService и изменить onLogout() функцию в header.component.ts на это: 

onLogout(){
  localStorage.removeItem('auth');
  this.router.navigateByUrl('/login');
}
...