InvalidTokenError: Invalid token specified: invalid base64 for part #2 (Property 'atob' doesn't exist)]

When I try to decode the tokens using Jwtdecode, it just gives me this error message:

Warning: An unhandled error was caught from submitForm() [InvalidTokenError: Invalid token specified: invalid base64 for part #2 (Property ‘atob’ doesn’t exist)]

This is how my code looks:

  import { jwtDecode } from "jwt-decode";

//.
//.
//.

  const handleSumbit = async ({ email, password }) => {
    const result = await authApi.login(email, password);
    if (!result.ok) return setLoginFailed(true);
    setLoginFailed(false);

    const token = result.data;
    const decoded = jwtDecode(token);
    console.log(decoded);
  };

Hi @christofer41,

Had the same issue - probably because the course is starting to be old now.

If you have not found the solution yet (and for others hitting this page and looking for an answer):

  1. Install the core-js package containing atob:
npm install core-js
  1. Import atob to your file’s header:
import { jwtDecode } from "jwt-decode";
import "core-js/stable/atob";

That should resolve your issue :wink:

Cedric

1 Like

You need to poly-fill atob function

import { decode } from "base-64";
global.atob = decode;

Reference : GitHub - auth0/jwt-decode: Decode JWT tokens; useful for browser applications.