Interact with Convex from Nextjs Backend, securely and minimal
My Nextjs backend needs to interact with Convex a lot and I want to ask what the best patterns are. I want my convex functions to know: "This request is coming from our nextjs backend so it's good, let's continue"
Currently I am passing {token} to fetchQueries and fetchMutations but this is annoying because I have to pass around that token all the time. It also means I need an authenticated user, or I need to remove auth-check from my endpoint. (token can also only be generated in pages/routes/server actions, so I cant use Convex in util functions without passing that token around all the time...)
Another option would be to use an SECRET_KEY on both ends, but that means I would need to pass that into the arguments and my SECRET_KEY would be logged in history in the dashboard, I dont like that approach.
I feel like we need a better, officially recommended method/helper here. Before, I was using Drizzle so I had direct access to my database on the nextjs backend. This made it very easy to just get data anywhere. I need some helper to do operations on the serverside directly to convex, and convex needs to know that the request came from my nextjs backend.
Looking forward to hearing all your thoughts!
6 Replies
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!
Or should I move my custom AI and data processing to the convex side and do all compute there?
I am using AI-SDK but I am adding lots of custom stuff and RAG
I am just not sure about the costs of moving it to convex. What about the long generation steps, how am I billed for those?
I am not sure if the AI components that are available will fit my needs. I need lots of customization and control over the flows of the agents
Running your backend all on Convex is generally ideal. I would say try it out and see if there are prohibitive cost differences. You can use AI SDK direct in a node action, component isn't required, but if the component can do what you need it should simplify things.
Awesome, I am also a bit lost on the way I should stream and persist data. I have seen a few convex videos and components but not sure how they work together. Could you tell me how to do these:
1. Persistent streaming, multiple tabs all stream at the same time.
2. Saving all messages, including toolcalls
3. I also want to show custom UI for toolcall results, I am not able to find how to do this in the agent docs. I would like to render custom components in the frontent. I am not sure if I should send the results as an object response, a text response, or some other custom way to send data back. In the AI SDK docs I found this: https://ai-sdk.dev/docs/ai-sdk-ui/streaming-data about sending custom data messages.
4. I saw there is an agent component and a persistent streaming component, but I wasn't able to find docs on how to combine the two. This video only shows how to use persistent streaming with the openai package.
Small side note: AI SDK v5 also came out recently and I was wondering if any breaking changes / improvements are planned
Streaming Custom Data
Learn how to stream custom data from the server to the client.
Convex
YouTube
Streaming vs. Syncing: Why Your Chat App Is Burning Bandwidth
If you’re a developer building an AI chat app and want to ensure seamless user experiences—even during page refreshes or across multiple tabs—this video is for you. It introduces Convex’s Persistent Text Streaming component, a solution designed to handle real-time streaming and data persistence challenges in AI chat applications.
The Co...
Use the Agent component to handle storing messages, streaming them to all tabs, etc. You don't need to combine them - the Agent component has built-in streaming support (see docs)
Then on the frontend you can use the
useThreadMessages to list the messages and show your custom UI.
In the docs, it lists them and calls toUIMessages(optional). Once you have the data there, you can pass that data as props to any UI component you want. Normal React.
There's an #agents channel where folks have been talking about their favorite UI component libraries.
https://docs.convex.dev/agents/messages#retrieving-messages
I have a PR up adding v5 support - unfortunately a ton of things changed and broke in terms of types, but the component is backwards compatible with schema so no data migration is needed.
https://github.com/get-convex/agent/pull/93GitHub
Support AI SDK 5 by ianmacartney · Pull Request #93 · get-convex/...
Fixes #79
By submitting this pull request, I confirm that you can use, modify, copy, and redistribute this contribution, under the terms of your choice.
Messages | Convex Developer Hub
Sending and receiving messages with an agent
Awesome! Thanks!