Расшифровать токен JWT в Ionic

Question

Я пытаюсь получить некодированный токен от ws, но у меня ничего не получается. Маркер - это JWT. Знак, который мне возвращает ws, следующий:

{\"token\":\"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJDb2RpZ28iOiIxMTY4IiwiVXN1YXJpbyI6IjU0MDMyIiwiUGFzc3dvcmQiOiJmZGM3OTZlNzkwMjk2NTdjZGE2YjY1OWQ3NjI0MjAyYSIsIk5vbWJyZXMiOiJEYW5pbG8gRXN0dWFyZG8iLCJBcGVsbGlkb3MiOiJJdHplcCBMdW5hIiwiTm9tYnJlQ29tcGxldG8iOiJEYW5pbG8gRXN0dWFyZG8gSXR6ZXAgTHVuYSIsIlRva2VuIjoiNzQ1QzMzNjktMUUwMy00QTJBLTk1Q0YtMzI4NTZGRUU0MEQ2Iiwic3RhdHVzIjoiT0siLCJuYmYiOjE1NDE0NDkzOTcsImV4cCI6MTU0MTQ1MTE5NywiaWF0IjoxNTQxNDQ5Mzk3LCJpc3MiOiJodHRwOi8vbG9jYWxob3N0OjQ5OTc1LyIsImF1ZCI6Imh0dHA6Ly9sb2NhbGhvc3Q6NDk5NzUvIn0.aZA9yOosJzQqZdpMkYtzIHOj3oqYv5tU_qffVyIXOkg\"}

Мне нужен только следующий код без диагоналей:

eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJDb2RpZ28iOiIxMTY4IiwiVXN1YXJpbyI6IjU0MDMyIiwiUGFzc3dvcmQiOiJmZGM3OTZlNzkwMjk2NTdjZGE2YjY1OWQ3NjI0MjAyYSIsIk5vbWJyZXMiOiJEYW5pbG8gRXN0dWFyZG8iLCJBcGVsbGlkb3MiOiJJdHplcCBMdW5hIiwiTm9tYnJlQ29tcGxldG8iOiJEYW5pbG8gRXN0dWFyZG8gSXR6ZXAgTHVuYSIsIlRva2VuIjoiNzQ1QzMzNjktMUUwMy00QTJBLTk1Q0YtMzI4NTZGRUU0MEQ2Iiwic3RhdHVzIjoiT0siLCJuYmYiOjE1NDE0NDkzOTcsImV4cCI6MTU0MTQ1MTE5NywiaWF0IjoxNTQxNDQ5Mzk3LCJpc3MiOiJodHRwOi8vbG9jYWxob3N0OjQ5OTc1LyIsImF1ZCI6Imh0dHA6Ly9sb2NhbGhvc3Q6NDk5NzUvIn0.aZA9yOosJzQqZdpMkYtzIHOj3oqYv5tU_qffVyIXOkg

Это функция, которую токен получает:

this.webService.doLogin(body)
    .then((response) => {
      this.jsonToken = jwt_decode(response.data);
      this.nativeStorage.set("json", this.jsonToken );
      this.toasNative.show(JSON.parse(this.jsonToken) , "3000", "bottom").subscribe();   
      this.navCtrl.push(HomePage);
    }).catch((error) => {
      this.toasNative.show(error, "3000", "bottom").subscribe();
    });

Я пользуюсь библиотекой import * as jwt_decode from "jwt-decode";

если токен я сохраняю с помощью JSON.stringify (), то результат заключается в добавлении в код обратных диагоналей.

this.jsonToken = JSON.stringify(response.data);
this.nativeStorage.set("json", this.jsonToken);
this.toasNative.show(this.jsonToken, "3000", "bottom").subscribe();

"\"{\\\"token\\\":"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJDb2RpZ28iOiIxMTY4IiwiVXN1YXJpbyI6IjU0MDMyIiwiUGFzc3dvcmQiOiJmZGM3OTZlNzkwMjk2NTdjZGE2YjY1OWQ3NjI0MjAyYSIsIk5vbWJyZXMiOiJEYW5pbG8gRXN0dWFyZG8iLCJBcGVsbGlkb3MiOiJJdHplcCBMdW5hIiwiTm9tYnJlQ29tcGxldG8iOiJEYW5pbG8gRXN0dWFyZG8gSXR6ZXAgTHVuYSIsIlRva2VuIjoiNzQ1QzMzNjktMUUwMy00QTJBLTk1Q0YtMzI4NTZGRUU0MEQ2Iiwic3RhdHVzIjoiT0siLCJuYmYiOjE1NDE0NDkzOTcsImV4cCI6MTU0MTQ1MTE5NywiaWF0IjoxNTQxNDQ5Mzk3LCJpc3MiOiJodHRwOi8vbG9jYWxob3N0OjQ5OTc1LyIsImF1ZCI6Imh0dHA6Ly9sb2NhbGhvc3Q6NDk5NzUvIn0.aZA9yOosJzQqZdpMkYtzIHOj3oqYv5tU_qffVyIXOkg\\\"}\"

Также попробуйте этот способ, но он возвращает декодированный токен:

this.jsonToken = jwt_decode(response.data);
this.toasNative.show(JSON.stringify(this.jsonToken) , "3000", "bottom").subscribe();

{
  "Codigo": "1168",
  "Usuario": "54032",
  "Password": "fdc796e79029657cda6b659d7624202a",
  "Token": "745C3369-1E03-4A2A-95CF-32856FEE40D6",
  "status": "OK",
  "nbf": 1541449397,
  "exp": 1541451197,
  "iat": 1541449397,
  "iss": "http://localhost:49975/",
  "aud": "http://localhost:49975/"
}

Также попробуйте этот способ, но он возвращает SyntaxError Unexpected token o in JSON at position 1

 this.jsonToken = jwt_decode(response.data);
      this.nativeStorage.set("json", this.jsonToken );
      this.toasNative.show(JSON.parse(this.jsonToken) , "3000", "bottom").subscribe();   

Update . Это мой компонент:

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { HomePage } from '../home/home';  
import { Storage } from '@ionic/storage';
import { ServiceProvider } from '../../providers/service/service';

import { Toast } from '@ionic-native/toast';
import * as jwt_decode from "jwt-decode";

@IonicPage()
@Component({
  selector: 'page-login',
  templateUrl: 'login.html',
})
export class LoginPage {
  paginaprincipal: any = HomePage;
  loading: any;
  jsonToken: any;

  constructor(public navCtrl: NavController,
    public navParams: NavParams,
    private webService: ServiceProvider,
    private nativeStorage: Storage,
    private toasNative: Toast) {
  }

  ionViewDidLoad() {
    console.log('ionViewDidLoad LoginPage');
  }

  doLogin() {
    const body = {
      Codigo: "1168",
      Usuario: "54032",
      Password: "01992004"
    };

    this.webService.doLogin(body)
    .then((response) => {
      //this.jsonToken = jwt_decode(response.data);
      var parse = JSON.parse(response.data);
      this.nativeStorage.set("json", parse);
      this.toasNative.show("Response with JSON.parse() :" + parse, "3000", "bottom").subscribe();   
      this.navCtrl.push(HomePage);
    }).catch((error) => {
      this.toasNative.show(error, "3000", "bottom").subscribe();
    });
  }
}

Если вы можете помочь мне получить жетон, большое спасибо.

Answer 1

Похоже, ваши данные имеют двойную кодировку.

Быстрое исправление - двойное декодирование, т. Е.

JSON.parse(JSON.parse(response.data)).token

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