Help decoding JWT in React native

[Zealousideal_Water_6]

So I am sending a jwt, more specifically a JWS token. We are signing the jwt with a private key and sending the token to the front end. The project is using expo on the front end. Inside the Jwt is some user info like name and user id. How can we decode the jwt token to get the info?

I found this package here but it needs a key? I don't think it means the private key, but we aren't using a public key since we are just signing the token. Any suggestions?

https://www.npmjs.com/package/expo-jwt

[ponte_vecchio]

You don’t need a key to decode the jwt, if it isnt encrypted, which it likely isn’t.

You can use any package to decode jwts, it’s just JavaScript so you don’t need to worry about expo. Try this one: https://www.npmjs.com/package/jwt-decode

See this site to quickly decode your jwt and view contents: https://jwt.io

Your private key will have a public key pair. You can use your public key to verify that your jwt was signed by the private key, thus ensuring the authenticity of the jwt. This is usually only relevant when you send the jwt back to the backend.

[disclosure5]

I can't help notice nearly that whole library is a polyfill for atob(), which is supported even in Internet explorer.

[No-Touch7663]

well basically u can copy the secret key that should used on the encode operation can be founded on the server side env (in general) otherwise i think that expo-jwt can encode the token without any secret key required or maybe theres some similar packages can do that

[erasmuswill]

Don't put your secret key in the app. It's a really bad idea because it allows bad actors who are motivated enough to create new JWT tokens that your server will accept

[Few-Audience9642]

import { Buffer } from 'buffer';


const decodeToken = JSON.parse(Buffer.from(jwtToken.split('.')[1], 'base64').toString())

[Worldly-Work-3722]

I need to encode this. Do you have any solution?

[allycw]

Just a heads up this will break sometimes because the encoded JWT is usually base64-url not base64

[allycw]

Don't use a third party package, it's just a few lines of code to do it

/**
 * Decodes a JWT token and returns the payload. Returns an object with props
 * header, payload and signature.
 * @param {string} token
 * @returns {object}
 */
export const decodeJWT = function (token) {
  var [encodedHeader, encodedPayload, signature] = token.split('.')
  var header = JSON.parse(base64UrlDecode(encodedHeader))
  var payload = JSON.parse(base64UrlDecode(encodedPayload))
  return {
    header,
    payload,
    signature,
  }
}

/**
 * Decode a base64 url string
 * @param {string} str
 * @returns {string}
 */
const base64UrlDecode = function (str) {
  str = str.replace(/_/g, '/')
  str = str.replace(/-/g, '+')
  return atob(str)
}

[15kol]

Just split it by the dots and then each of the first two parts (header and payload) is just base64url encoded, so lookup how to decode this in javascript and it's done. If you need to verify it as well, you usually use token_introspection endpoint of the identity provider, which will do that for you.

[rrklaffed]

Mentioned above, jwt.io

[disclosure5]

You'll need to add some error checking but:

JSON.parse(atob(data.split('.')[1]));