#How to add auth data to ctx.auth?

13 messages · Page 1 of 1 (latest)

native stirrup
#

i have implemented my own auth system, so i wanna inject auth data to every convex function call from the client side for authorization of function execute. How to pass auth data?

marsh questBOT
#

Hi @native stirrup. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:

#

To add custom auth data to ctx.auth in Convex, you need to implement a custom authentication system. Here's how you can pass auth data from the client side:

  1. On the client side, you'll need to use convex.setAuth() to provide a function that fetches an authentication token. This token should be a JWT (JSON Web Token) that contains the custom auth data you want to pass.

  2. On the server side, you need to configure Convex to validate and decode this custom JWT.

Here's a basic outline of the process:

  1. Client-side setup:
convex.setAuth(async () => {
  // Fetch or generate your custom JWT here
  const token = await fetchCustomToken();
  return token;
});
  1. Server-side setup:

You need to configure your Convex deployment to recognize and validate your custom JWT. This involves setting up a custom auth provider in your convex/auth.config.ts file and exposing the necessary endpoints for JWT validation.

For a detailed guide on implementing custom authentication, you can refer to the Custom Auth documentation.

It's important to note that implementing a fully custom auth system can be complex and may have security implications. If possible, it's recommended to use one of the supported auth providers or integrate with an OpenID Connect compatible provider.

If you need more specific guidance, please provide more details about your custom auth system and what exactly you're trying to achieve.

Custom Auth documentation

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

#

@native stirrup Kapa.ai is still learning and improving, please let me know how I did by reacting below.

native stirrup
#

@marsh quest , what if custom auth in react native? so i will not have domain?

marsh questBOT
#

Let me check the knowledge base for you again. One moment! :books:

#

When implementing custom authentication in a React Native app with Convex, you don't necessarily need a domain as you would with a web application. However, you still need to follow a similar process to authenticate your users and pass the authentication data to Convex. Here's how you can approach this:

  1. Client-side (React Native):
    You'll need to implement a custom authentication flow in your React Native app. This could involve using a third-party authentication service or implementing your own authentication logic.

  2. Token Generation:
    After authenticating the user, you need to generate a JWT (JSON Web Token) that contains the user's authentication information.

  3. Passing the token to Convex:
    You can use the ConvexProviderWithAuth component from Convex to handle authentication. Here's an example of how you might set this up:

import { ConvexProviderWithAuth } from "convex/react";
import { ConvexReactClient } from "convex/react";

const convex = new ConvexReactClient(process.env.EXPO_PUBLIC_CONVEX_URL);

function useCustomAuth() {
  const fetchAccessToken = useCallback(async () => {
    // Implement your custom logic to fetch or generate the JWT
    const token = await generateCustomJWT();
    return token;
  }, []);

  return useMemo(() => ({
    isLoading: false, // Implement your own loading state
    isAuthenticated: true, // Implement your own auth check
    fetchAccessToken,
  }), [fetchAccessToken]);
}

// In your app's root component
<ConvexProviderWithAuth client={convex} useAuth={useCustomAuth}>
  {/* Your app components */}
</ConvexProviderWithAuth>
  1. Server-side (Convex):
    On the Convex side, you need to configure your deployment to validate and decode the custom JWT. This is done in the convex/auth.config.ts file:
# 
export default {
  providers: [
    {
      domain: "<https://your-custom-domain.com",> // This can be any unique identifier for your app
      applicationID: "your-app-id",
      // Add any other necessary configuration
    },
  ],
};

Even though you don't have a web domain, you still need to provide a unique identifier in the domain field. This could be a made-up URL or any string that uniquely identifies your app.

  1. JWT Validation:
    You'll need to implement the logic to validate the JWT on the Convex side. This might involve setting up a custom endpoint or using a third-party service to validate the token.

Remember that implementing a custom authentication system can be complex and has security implications. If possible, consider using one of the supported auth providers or integrating with an OpenID Connect compatible provider that works well with React Native.

For more detailed information on custom auth integration with Convex, you can refer to the Custom Auth Integration documentation.

Custom Auth Integration documentation

If you need more specific guidance, please provide more details about your custom auth system and what exactly you're trying to achieve in your React Native app.

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

#

@native stirrup Kapa.ai is still learning and improving, please let me know how I did by reacting below.

native stirrup
#

@marsh quest can't simply add JWT from the client to server function?

marsh questBOT
#

Let me check the knowledge base for you again. One moment! :books:

#

Based on the information provided in the knowledge sources, it's not possible to simply add a JWT from the client to a server function in Convex without proper configuration. Convex has a specific authentication system that needs to be set up correctly. Here's why:

  1. Convex uses OpenID Connect (based on OAuth) ID tokens in the form of JWTs to authenticate WebSocket connections or RPCs. These JWTs need to be validated by Convex on the server-side.

  2. The server-side validation of JWTs is done based on the configuration in your auth.config.ts file. Convex looks at the "iss" (issuer) field inside the token and matches it with the configuration in auth.config.ts.

  3. Convex then calls the /.well-known/jwks.json endpoint of the configured issuer to get the public keys to verify the token.

You can't bypass this system by simply sending a custom JWT from the client. Instead, you need to implement a proper authentication flow that Convex can validate.

If you want to use a custom JWT, you would need to:

  1. Set up a custom auth provider in your auth.config.ts file.
  2. Implement the necessary endpoints for JWT validation that Convex expects.
  3. Use convex.setAuth() on the client-side to provide the JWT.

As mentioned in the Custom Auth documentation, implementing a fully custom auth system can be complex and may have security implications.

If you're looking for a simpler solution, you might want to consider using one of the supported auth providers or integrating with an OpenID Connect compatible provider. This would give you the security and ease of use of a well-established system while still allowing you to authenticate your users and access ctx.auth in your Convex functions.