Prevent users from seeing and reusing the twitch_auth_token sent in request headers by my Twitch extension?

Extensions
1

How can I prevent users from seeing and reusing the twitch_auth_token sent in request headers by my Twitch extension?

In my Twitch extension frontend, I retrieve an auth token like this:

twitch.onAuthorized((authData) => {
  resolve(authData);
});

const headers = {
  headers: {
    'twitch_auth_token': auth.token
  }
};

const response = await api.getViewerID(headers, authentication.getChannelId());

On the backend, I validate this twitch_auth_token using the twitch secret for the extension.

However, since the token is sent as a header from the frontend, users can easily see it in Chrome DevTools’ network tab and extract it.

Because of this, they can take that token and make unauthorized API calls directly by passing the same header — which I want to prevent.

As a frontend developer, what’s the best way to securely pass this token to the backend without exposing it in visible request headers or enabling users to reuse it maliciously? Are there better alternatives or best practices to protect the token from being inspected or misused?

2

After some of my own research I came across the following:

  1. Always verify the JWT token’s expiration using the exp claim or maxAge option in jwt.verify. This ensures tokens expire after a set time, limiting how long they can be reused.
  2. For every update request, confirm the channel_id in the decoded JWT matches the channel being updated in the database. This prevents users from modifying resources they don’t own.
  3. Use unique nonces for each sensitive request and store them in your database. Reject any requests with previously used nonces to block replay attacks.
3

You can’t

It’s public and intended to be public.

This depends on why you need to prevent misuse.

For example, I have a “misuse prevent” via rate limiting on the action that the request does.