Clever Tagline•5mo ago

Custom function for HTTP action?

I want to use the same authorization process for all HTTP actions in a project rather than including the auth code in each action. I thought a custom action might work, but after reading the Stack post about custom functions, and also reviewing the code in the convex-helpers package, HTTP actions don't appear to be supported. Am I reading that correctly?

12 Replies

Convex Bot•5mo ago

Thanks for posting in <#1088161997662724167>. Reminder: If you have a Convex Pro account, use the Convex Dashboard to file support tickets. - Provide context: What are you trying to achieve, what is the end-user interaction, what are you seeing? (full error message, command output, etc.) - Use search.convex.dev to search Docs, Stack, and Discord all at once. - Additionally, you can post your questions in the Convex Community's <#1228095053885476985> channel to receive a response from AI. - Avoid tagging staff unless specifically instructed. Thank you!

ballingt•5mo ago

That's right, you'd need to do something similar. It's not as messy as custom functions because there's less going on, you can wrap a httpAction without changing as much.

ballingt•5mo ago

Also once you get deep into this you might want to jump to something like https://hono.dev/

Hono is a small, simple, and ultrafast web framework built on Web Standards. It works on Cloudflare Workers, Fastly Compute, Deno, Bun, Vercel, Netlify, AWS Lambda, Lambda@Edge, and Node.js. Fast, but not only fast.

ballingt•5mo ago

(whcih you can run from an httpAction) But you can write your own httpAction function without too many type gymnastics

Clever TaglineOP•5mo ago

Thanks. I don't see us needing that many HTTP actions for our use case, so I probably won't need to go as far as Hono. As for how to wrap httpAction, are there any examples on how to do that? Or should I just review how it's handled for the other functions in convex-helpers?

Indy•5mo ago

I think we have cors helper that does this... @Tom Redman ?

Tom Redman•5mo ago

Yes we have a CORS wrapper that wraps the HttpAction. It should be a good example — let me grab that link

Tom Redman•5mo ago

@Clever Tagline let me know if this works as an example of wrapping the HttpAction: https://github.com/tomredman/convex-cors/blob/main/convex/helpers/corsHttpRouter.ts

GitHub

convex-cors/convex/helpers/corsHttpRouter.ts at main · tomredman/co...

Contribute to tomredman/convex-cors development by creating an account on GitHub.

Tom Redman•5mo ago

This wraps the router, but the pattern should be similar. Can dig in more a little later! Line 290 has an example of wrapping an action.

Clever TaglineOP•5mo ago

@Indy @Tom Redman Thank you! I'll dig through that and let you know if I have any more questions. I got it working. This was a new experience for me, so maybe there's something I could do better, but here's how I implemented it in case it can be useful for others. Here's my wrapper function (simplified):

import { PublicHttpAction } from "convex/server";
import { httpAction } from "./_generated/server"

export const authCheck = (originalHandler: PublicHttpAction) => {
  return httpAction(async (_, request) => {

    // ... Validate the request ...
    // Responses with error codes are returned if validation fails for various reasons

    // If we got this far, execute the original handler
    let originalResponse = await originalHandler(_, request);

    return new Response(originalResponse.body, {
      status: originalResponse.status,
      statusText: originalResponse.statusText,
      headers: originalResponse.headers
    })
  })
}

import { PublicHttpAction } from "convex/server";
import { httpAction } from "./_generated/server"

export const authCheck = (originalHandler: PublicHttpAction) => {
  return httpAction(async (_, request) => {

    // ... Validate the request ...
    // Responses with error codes are returned if validation fails for various reasons

    // If we got this far, execute the original handler
    let originalResponse = await originalHandler(_, request);

    return new Response(originalResponse.body, {
      status: originalResponse.status,
      statusText: originalResponse.statusText,
      headers: originalResponse.headers
    })
  })
}

I tested the wrapping behavior like so:

export const authTest = authCheck(
  httpAction(async (ctx, request) => {
    // ... core action logic ...
    return new Response("OK", {status: 200});
  })
)

export const authTest = authCheck(
  httpAction(async (ctx, request) => {
    // ... core action logic ...
    return new Response("OK", {status: 200});
  })
)

In the http.ts file, authTest was set as the handler on the desired route. I tested with both valid and invalid credentials, and it performed as desired. 👍 Being new to writing wrapper functions, my only question is re: the function design. My original version accepted an object with a originalHandler property (following the example in the code you shared), but then I simplified it to just accept a single argument, as using the object felt like unnecessary complexity for my use case. Is there a benefit to doing it one way vs the other?

ballingt•5mo ago

Looks good! I would probably return the original response directly instead of creating a new one, in case there are other things beisdes status, statusText, headers, and body on it. Simplified seesm great. The versions in convex-helpers are sometimes more general because we want devs to be able to do anything with them, but I wouldn't make your own verison more general than it needs to be.

Clever TaglineOP•5mo ago

Good point. 👍

Custom function for HTTP action?

Did you find this page helpful?