0

我在登录时遇到了一些错误，这是意料之外的，但我尝试从 2 天开始解决它，但我不能。我使用 Nodejs 作为 api 和 angular 7 作为前端

我已经发布了一些带有错误的代码，请帮助我解决这个问题，非常感谢

auth.service.ts

import { Injectable } from "@angular/core";
import { Observable } from "rxjs";
import "rxjs/Rx";
import { JwtHelperService } from "@auth0/angular-jwt";
import "core-js/es7/reflect";

import { HttpClient } from "@angular/common/http";

const jwt = new JwtHelperService();
@Injectable()
export class AuthService {
  private decodedToken;
  constructor(private http: HttpClient) {}
  public register(userData: any): Observable<any> {
    return this.http.post("/api/v1/users/register", userData);
  }
  public login(userData: any): Observable<any> {
    return this.http.post("/api/v1/users/auth", userData).map(token => {
      //debugger;
      return this.saveToken(token);
    });
  }

  private saveToken(token): string {
    //debugger;
    this.decodedToken = jwt.decodeToken(token);
    localStorage.setItem("bwm_auth", token.token);
    localStorage.setItem("bwm_meta", JSON.stringify(this.decodedToken));
    return token;
  }
}

登录组件.ts

import { Component, OnInit } from "@angular/core";
import { Router, ActivatedRoute } from "@angular/router";
import { AuthService } from "../shared/auth.service";
import { FormBuilder, FormGroup, Validators } from "@angular/forms";

@Component({
  selector: "bwm-login",
  templateUrl: "./login.component.html",
  styleUrls: ["./login.component.scss"]
})
export class LoginComponent implements OnInit {
  loginForm: FormGroup;
  mistake: any[] = [];
  notifyMessage: string = "";
  constructor(
    private fb: FormBuilder,
    private auth: AuthService,
    private router: Router,
    private route: ActivatedRoute
  ) {}

  ngOnInit() {
    this.initForm();
    this.route.params.subscribe(params => {
      if (params["registered"] == "success") {
        //debugger;
        this.notifyMessage =
          "You have been successfully registered you can login now";
      }
    });
  }
  initForm() {
    this.loginForm = this.fb.group({
      email: [
        "",
        [
          Validators.required,
          Validators.pattern(
            "^[a-zA-Z0-9.!#$%&’*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:.[a-zA-Z0-9-]+)*$"
          )
        ]
      ],
      password: ["", Validators.required]
    });
  }
  isInvalidForm(fieldName): boolean {
    return (
      this.loginForm.controls[fieldName].invalid &&
      (this.loginForm.controls[fieldName].dirty ||
        this.loginForm.controls[fieldName].touched)
    );
  }
  isRequiredForm(fieldName): boolean {
    return this.loginForm.controls[fieldName].errors.required;
  }
  login() {
    // debugger;

    //console.log(this.loginForm.value);
    this.auth.login(this.loginForm.value).subscribe(
      token => {
        //debugger;
        this.router.navigate(["/rentals"]);
      },
      errorResponse => {
        // debugger;
        console.log(errorResponse);
        // this.mistake = errorResponse.error.errors;
        //this.mistake = errorResponse.error;
      }
    );
  }
}

浏览器中的错误

TypeError: token.split is not a function
    at JwtHelperService.push../node_modules/@auth0/angular-jwt/src/jwthelper.service.js.JwtHelperService.decodeToken (jwthelper.service.js:70)
    at AuthService.push../src/app/auth/shared/auth.service.ts.AuthService.saveToken (auth.service.ts:26)
    at MapSubscriber.project (auth.service.ts:20)
    at MapSubscriber.push../node_modules/rxjs/_esm5/internal/operators/map.js.MapSubscriber._next (map.js:35)
    at MapSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.next (Subscriber.js:54)
    at MapSubscriber.push../node_modules/rxjs/_esm5/internal/operators/map.js.MapSubscriber._next (map.js:41)
    at MapSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.next (Subscriber.js:54)
    at FilterSubscriber.push../node_modules/rxjs/_esm5/internal/operators/filter.js.FilterSubscriber._next (filter.js:38)
    at FilterSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.next (Subscriber.js:54)
    at MergeMapSubscriber.push../node_modules/rxjs/_esm5/internal/operators/mergeMap.js.MergeMapSubscriber.notifyNext (mergeMap.js:84)

浏览器中的错误

4

1 回答 1

-1

从服务器返回的令牌似乎不是字符串类型

public login(userData: any): Observable<any> {
    return this.http.post("/api/v1/users/auth", userData).map(token => {
      //debugger;
      return this.saveToken(token);
    });
  }

尝试检查从服务器返回的内容

于 2019-04-11T07:13:31.310 回答