Signed Token Between Two PWAs: HMAC-SHA256 With No Backend

You need to pass user identity from one PWA to another. Both apps run on separate Firebase projects. They share no database. They share no authentication.

You can solve this without writing backend code. You only need the browser Web Crypto API and a signed URL.

The problem: An internal tool called PanelControl needs to open another site called Orders. When a user clicks a button, the Orders site must know who the user is. Users should not login a second time.

Three ways to do this:

  • Shared Firebase: Requires a shared database. Not possible here.
  • postMessage: Requires same domain or a popup. Harder to manage.
  • HMAC signed URL: Use a link with a token. This works perfectly.

How it works: HMAC creates a signature using a secret key. The receiver uses the same key to check the signature. If they match, the sender is trusted.

The workflow:

  1. Sender side:
  • Create a payload with user name and timestamp.
  • Sign the payload using HMAC-SHA256.
  • Append the signature and payload to a URL.
  1. Receiver side:
  • Read the token from the URL.
  • Split the signature from the payload.
  • Re-calculate the signature using the shared secret.
  • Check if the token is expired (e.g., after 5 minutes).
  • If valid, set the user identity in the app.

Implementation details: The Web Crypto API is native to all modern browsers. It works with ArrayBuffer and requires no extra libraries.

To keep things clean, the receiver script runs in the head of the document. It verifies the token, checks the time, and immediately cleans the URL using history.replaceState. This removes the token from the browser bar so it stays hidden.

A note on security: The secret key lives in the client code. Anyone using DevTools can see it. This is fine for internal business tools where you only pass non-sensitive data like a name.

If you build a public app with sensitive data, use a server-side token instead. For internal tools, this client-only method is fast and effective.

No extra infrastructure. No extra databases. Just native browser tools.

Source: https://dev.to/androve2k/signed-token-between-two-pwas-hmac-sha256-with-no-backend-3jod