Skip to main content

JWT decoder in Visual Studio

So far I always used JWT.io to decode my JWT tokens. But today I discovered that I don't have to leave my Visual Studio IDE anymore. But before I show you this feature, let’s just briefly summarize what JWT tokens are.

JWT what?

JWT (JSON Web Token) is a compact, URL-safe token format used for securely transmitting information between parties. It is commonly used in authentication and authorization scenarios, especially in web and mobile applications.

A JWT consists of three parts:

  1. Header: Contains metadata about the token, such as the signing algorithm used (e.g., HS256 or RS256).
  2. Payload: Contains the claims, which are statements about the user or other data (e.g., user ID, roles). This data is not encrypted, so it should not include sensitive information.
  3. Signature: A cryptographic signature that ensures the token has not been tampered with. It is created by encoding the header and payload, then signing them using a secret key or public/private key pair.

JWT tokens are typically used in stateless authentication, meaning that once issued, the server doesn't need to store session data. The client sends the JWT with each request (usually in the Authorization header), and the server can validate it to authenticate the user.

The payload in a JWT is typically Base64Url encoded. This encoding is a variant of Base64, designed to be URL-safe. Unlike regular Base64, Base64Url replaces characters that might cause issues in URLs:

  • + is replaced with -
  • / is replaced with _
  • The padding = is removed

This allows the JWT to be safely transmitted in URLs, headers, or query parameters without needing further encoding. So to read the payload during debugging I typically used JWT.io before.

Decoding JWT tokens in Visual Studio

Today when reading a JWT formatted access token in Visual Studio, I noticed that a debugger visualizer was available that decoded it for me:

 


There was nothing extra that needs to be done as Visual Studio recognized the string as a JWT token automatically and selects the correct debugger visualizer for you.

Nice!

More information

JWT.io: Decode, verify and generate JSON Web Tokens (bartwullems.blogspot.com)

Popular posts from this blog

Podman– Command execution failed with exit code 125

After updating WSL on one of the developer machines, Podman failed to work. When we took a look through Podman Desktop, we noticed that Podman had stopped running and returned the following error message: Error: Command execution failed with exit code 125 Here are the steps we tried to fix the issue: We started by running podman info to get some extra details on what could be wrong: >podman info OS: windows/amd64 provider: wsl version: 5.3.1 Cannot connect to Podman. Please verify your connection to the Linux system using `podman system connection list`, or try `podman machine init` and `podman machine start` to manage a new Linux VM Error: unable to connect to Podman socket: failed to connect: dial tcp 127.0.0.1:2655: connectex: No connection could be made because the target machine actively refused it. That makes sense as the podman VM was not running. Let’s check the VM: >podman machine list NAME         ...

Azure DevOps/ GitHub emoji

I’m really bad at remembering emoji’s. So here is cheat sheet with all emoji’s that can be used in tools that support the github emoji markdown markup: All credits go to rcaviers who created this list.

VS Code Planning mode

After the introduction of Plan mode in Visual Studio , it now also found its way into VS Code. Planning mode, or as I like to call it 'Hannibal mode', extends GitHub Copilot's Agent Mode capabilities to handle larger, multi-step coding tasks with a structured approach. Instead of jumping straight into code generation, Planning mode creates a detailed execution plan. If you want more details, have a look at my previous post . Putting plan mode into action VS Code takes a different approach compared to Visual Studio when using plan mode. Instead of a configuration setting that you can activate but have limited control over, planning is available as a separate chat mode/agent: I like this approach better than how Visual Studio does it as you have explicit control when plan mode is activated. Instead of immediately diving into execution, the plan agent creates a plan and asks some follow up questions: You can further edit the plan by clicking on ‘Open in Editor’: ...