使用 xAuthToken 、spring redis 和 security 登錄應用程序

Question

我是 angular 新手，正在嘗試使用 spring boot、redis、spring security 和 Angular 開發登錄應用程序。 我在使用 Angular 5 時正在關注 Angular 2 教程，並嘗試將所有代碼轉換為 Angular 5。即使我轉換了大部分代碼，我也無法轉換localStorage.setItem("xAuthToken", res.json().token); 行，因為此代碼與 Angular 2 的 Http 相關。我的問題是它的等價物是什么？ 以下是我到目前為止所做的。

日志服務.ts

import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Observable } from 'rxjs';

@Injectable()
export class LoginService {

  constructor(private http: HttpClient) { }

  sendCredential(username: string, password: string) {

    //console.log("User -- > "+username,+"Pass -- > "+password);
    let url = "http://localhost:8181/token";
    let encodedCredentials = btoa(username + ":" + password);
    let basicHeader = "Basic " + encodedCredentials;
    let headers = new HttpHeaders({
      'Content-Type': 'application/x-www-form-urlencoded',
      'Authorization': basicHeader
    });

    return this.http.get(url, { headers: headers });

  }

 checkSession() {
    let url = "http://localhost:8181/checkSession";

    let headers = new HttpHeaders({
      'x-auth-token': localStorage.getItem('xAuthToken')
    });

    return this.http.get(url, { headers: headers });
  }
}

登錄.component.ts

import { Component, OnInit } from '@angular/core';
import {LoginService} from '../../services/login.service';

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

  private credential = {'username':'', 'password' : ''};
  private loggedIn = false;

  constructor(private loginService: LoginService) { }

  onSubmit() {
    this.loginService.sendCredential(this.credential.username, this.credential.password).subscribe(
        res => {
            console.log(res);
        localStorage.setItem("xAuthToken", res.json().token);
            this.loggedIn = true;
            location.reload();
        },
        error => {
            console.log(error);
        }
    );
  }

  ngOnInit() {
    this.loginService.checkSession().subscribe(
        res => {
            this.loggedIn=true;
        },
        error => {
            this.loggedIn=false;
        }
    );
  }

}

我收到錯誤：

具有現有代碼的“對象”類型不存在屬性“json”。

Answer 1

只需添加這個，它就會被解決：

localStorage.setItem("xAuthToken", res.token);

Answer 2

localStorage.setItem("xAuthToken", JSON.stringify(res)); “Appaji”這是pakka答案