angularjwtangular6lumenphp-jwt

Decode firebase/php-jwt in Angular 6


I am using firebase/php-jwt in my Backend Api (Using Lumen) to serve Authentication Token. and I am using Angular 6 in Frontend.

This is my result from backend after logged in : -

{
"message": "Successfully Authenticated !",
"status": "Found",
"code": 200,
"data": "Bearer eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJsdW1lbi1qd3QiLCJzdWIiOjEsImlhdCI6MTUzMzgxNjc3OCwiZXhwIjoxNTMzODIwMzc4fQ.84BaTHYoWPEzNsZ6Qu0YK-VQelN0WQ0gcmUdXsxO7OA"
}

My Payload structure for this token is :-

$payload = [
        'iss' => "lumen-jwt", // Issuer of the token
        'sub' => $user->user_id, // Subject of the token
        'iat' => time(), // Time when JWT was issued.
        'exp' => time() + (60*60) // Expiration time
    ];

So, When I am decoding it I just decode with : -

JWT::encode($payload, env('JWT_SECRET')); // In environment file "JWT_SECRET={random_secret_code}"

So, I have a constant JWT_SECRET which I am using.

My Question is in which algorithms the token is generating ? because I have not specifying any algorithm in the encode() function?

Now In Angular how can I extract by decoding the token to get user_id, expiration time and other informations ?


Solution

  • The token was signed with the HS256 algorithm, which is probably configured as the default algorithm in PHP-JWT. You can get that information just by pasting your token into the https://jwt.io online debugger.

    The header looks like this:

    {
      "typ": "JWT",
      "alg": "HS256"
    }
    

    In Angular, you can use the package jwt-decode:

    Install it with: npm install --save jwt-decode

    and use it like this:

    var decode = require('jwt-decode');
    
    var token = "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJsdW1lbi1qd3QiLCJzdWIiOjEsImlhdCI6MTUzMzgxNjc3OCwiZXhwIjoxNTMzODIwMzc4fQ.84BaTHYoWPEzNsZ6Qu0YK-VQelN0WQ0gcmUdXsxO7OA"
    const tokenPayload = decode(token);
    
    console.log(tokenPayload.exp) // read the expiration time