Wasp•3mo ago

Get JWT Token

I have created a new API to offload some of the video processing. But want to add AUTH to it. I thought I can leverage the AUTH that Wasp is using out of the box. My Wasp app will make API calls to this new API, can I send my JWT Token from Wasp to the new API? How do I do that?

10 Replies

kapa.ai•3mo ago

Hi @Gwain. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- Yes, you can send the JWT token from your Wasp app to your new API to handle authentication. Here’s how you can approach this based on the available information: 1. How Wasp Handles JWT Tokens Wasp uses JWT tokens for authentication. When a user logs in, a JWT is generated and used to authenticate requests between the client and the Wasp server. This token is typically sent in the Authorization header as a Bearer token. 2. Sending the JWT to Your New API When your Wasp app needs to make a request to your new API, you can extract the JWT token from the request context (on the server side) or from the client (if making requests directly from the frontend), and then include it in the Authorization header of the outgoing request to your new API. Example (Node.js/Express):

// On the Wasp server, inside an action or query
const jwtToken = context.token; // or context.req.headers['authorization']

// Use fetch or axios to call your new API
await fetch('<https://your-new-api.com/endpoint',> {
  method: 'POST',
  headers: {
    'Authorization': jwtToken, // or 'Bearer ' + jwtToken
    'Content-Type': 'application/json'
  },
  body: JSON.stringify({ /* your data */ })
});

// On the Wasp server, inside an action or query
const jwtToken = context.token; // or context.req.headers['authorization']

// Use fetch or axios to call your new API
await fetch('<https://your-new-api.com/endpoint',> {
  method: 'POST',
  headers: {
    'Authorization': jwtToken, // or 'Bearer ' + jwtToken
    'Content-Type': 'application/json'
  },
  body: JSON.stringify({ /* your data */ })
});

This way, your new API can verify the JWT using the same secret or public key as your Wasp app. 3. Security Considerations - Make sure your new API knows how to verify the JWT token (using the same secret or public key as Wasp). - You can restrict access to your new API so that only requests with valid JWTs are processed. - For extra security, you can use a shared secret between your Wasp server and your new API, as suggested in the community: "you can make it so that there is a secret key that you have on your existing data API server, and that only it knows, and then you also have that secret key available as an env var to your Wasp server, and it will be sending it along in each request" Running alongside separate authed API?. 4. Example Use Case This approach is typical in microservice architectures, where the main server (Wasp) acts as a proxy and handles user authentication, then forwards requests to internal services, passing along the JWT or other credentials as needed Running alongside separate authed API?. --- Summary:
Yes, you can send the JWT token from your Wasp app to your new API by including it in the Authorization header of your API requests. Your new API should then verify the token to authenticate the user. This is a common and recommended approach for integrating authentication across services. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ---------------------- Sorry @Gwain, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist: Perhaps try again in 15mins?

GwainOP•3mo ago

I would like to do it directly from my wasp front end, not from an action. Do I have the jwtToken on the client? @kapa.ai . @kapa.ai

kapa.ai•3mo ago

Let me check the knowledge base for you again. One moment! :books: Sorry @Gwain, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist: Perhaps try again in 15mins?

GwainOP•3mo ago

I would like to do it directly from my wasp front end, not from an action. Do I have the jwtToken on the client? @kapa.ai

kapa.ai•3mo ago

Let me check the knowledge base for you again. One moment! :books: ---------------------- Based on the available knowledge sources, Wasp's authentication system uses sessions, which are stored in localStorage on the client and in the database on the server. However, the documentation does not specify that a JWT token is directly accessible on the client side. Instead, Wasp abstracts session management for you, and you typically interact with the user's authentication state via the useAuth hook or the user prop in your React components, not by handling the raw JWT token itself Docs: Auth Overview - Sessions Docs: Auth Overview - useAuth. There are community discussions and older issues suggesting that JWTs were used and stored in localStorage in earlier versions or in custom setups, but the current official documentation describes session-based auth with Lucia Auth, not direct JWT handling on the client Github Issue: Should we use sessions instead of JWT in Wasp for authentication?. In summary:
With the current Wasp setup, you do not have direct access to a JWT token on the client by default. If you need a JWT for your custom API, you would need to implement a custom API endpoint in your Wasp backend that issues a JWT, which your frontend can then request and use as needed. There is no built-in way to extract the JWT from the client in the standard Wasp auth flow. If you need to implement this, you can refer to community examples of creating a custom API endpoint that generates a JWT and returns it to the client Discord: Best Practices for Implementing Auth System in Chrome Extension. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ---------------------- Sorry @Gwain, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist: Perhaps try again in 15mins?

toticozeni•3mo ago

Hey @Gwain, I would recommend you to route your requests through server rather than directly form client if possible, for security reasons. How exactly are you offloading API calls? Do you host a server separate from wasp server?

GwainOP•3mo ago

@toticozeni The issue is the app has to do with send large files, so I didnt want an extra leg of sending it from client to wasp server to custom server. But I might have to?

toticozeni•3mo ago

I’ll be online tommorrow to discuss more, but presigned urls might be what you need.

GwainOP•3mo ago

Great! I'll look into that now

toticozeni•3mo ago

Hey @Gwain any progress? Was presigned urls something you were looking for? They would create temporary URL's for people to offload heavy traffic from Wasp server.

Gaming

Programming

Get JWT Token

Did you find this page helpful?