Rune Darkfire•4mo ago

Can't deploy convex to production with vercel correctly.

As per title. Been following this guide here, it's fairly clear : https://docs.convex.dev/production/hosting/vercel. All the steps seem to have been completed fine, and then when I goto my convex dashboard and make sure I am on the production instance of my app, I can see that my tables exist in the DB, but once logged in to my deployed appication, I can't actually populate any data. I'm aware this is a very vague question but I'm not sure how to provide any more details. My code all works perfectly fine locally and the database integration locally has been fine, I have a fully functional application. But I'm just not sure where to go from here. It appears the database calls just aren't doing anything at all on my production environment -- looking in dev tools in Chrome, I don't see any activity at all when I click on a button that should generate activity. Any help would be appreciated - thank you!

18 Replies

Convex Bot•4mo 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!

Rune DarkfireOP•4mo ago

For example, data that should be populating right off the bat but does nothing (works perfectly locally, but does absolutely nothing on prod) :

const { isLoaded, isSignedIn, orgId } = useAuth();
const contractTypes = useQuery(api.contract_types.list, { orgId: orgId !== undefined ? orgId : null })
  const addContractType = useMutation(api.contract_types.add)
  const vendorCategories = useQuery(api.vendor_categories.list, { orgId: orgId !== undefined ? orgId : null })
  const addVendorCategory = useMutation(api.vendor_categories.add)

  const settingsLoaderRef = useRef(false);

useEffect(() => {
    if (!settingsLoaderRef.current && isLoaded && isSignedIn && orgId
        && contractTypes && vendorCategories) {
      settingsLoaderRef.current = true
      if (!contractTypes.length) setContractTypeDefaults()
      if (!vendorCategories.length) setVendorCategoryDefaults()
    }
  }, [isLoaded, isSignedIn, contractTypes, vendorCategories, orgId]);

  const setContractTypeDefaults = async () => {
    await Promise.all(defaultContractTypes.map((defaultType) => {
      addContractType({ orgId: orgId !== undefined ? orgId : null, name: defaultType })
    }))
  }

const { isLoaded, isSignedIn, orgId } = useAuth();
const contractTypes = useQuery(api.contract_types.list, { orgId: orgId !== undefined ? orgId : null })
  const addContractType = useMutation(api.contract_types.add)
  const vendorCategories = useQuery(api.vendor_categories.list, { orgId: orgId !== undefined ? orgId : null })
  const addVendorCategory = useMutation(api.vendor_categories.add)

  const settingsLoaderRef = useRef(false);

useEffect(() => {
    if (!settingsLoaderRef.current && isLoaded && isSignedIn && orgId
        && contractTypes && vendorCategories) {
      settingsLoaderRef.current = true
      if (!contractTypes.length) setContractTypeDefaults()
      if (!vendorCategories.length) setVendorCategoryDefaults()
    }
  }, [isLoaded, isSignedIn, contractTypes, vendorCategories, orgId]);

  const setContractTypeDefaults = async () => {
    await Promise.all(defaultContractTypes.map((defaultType) => {
      addContractType({ orgId: orgId !== undefined ? orgId : null, name: defaultType })
    }))
  }

I get no error messages, no feedback of any kind, and obviously since this is production I can't do console.logs and stuff like that.

jamalsoueidan•4mo ago

The problem mostly can happen due to missing environments...which did you setup in versel? You need CONVEX_DEPLOY_KEY and CONVEX_URL setup and are you using nextjs, or remixjs, and what is the link to your app 🙂

erquhart•4mo ago

(link to app shouldn't be requested for troubleshooting)

erquhart•4mo ago

As mentioned, it's probably env vars. You're on Vercel so guessing you're using Next? You should see some sort of error either during the build process or in the browser. Also make sure you're following the instructions in the Convex docs for production deployment: https://docs.convex.dev/production/hosting/vercel

Using Convex with Vercel | Convex Developer Hub

Host your frontend on Vercel and your backend on Convex.

Rune DarkfireOP•4mo ago

Thanks for the feedback here so far. Here is a screnshot of my env vars page :

Rune DarkfireOP•4mo ago

@erquhart you literally linked the exact guide that I said I already followed lol I did all five of those steps and they "worked", the build was successful (I got appropriate messaging in the vercel logs), and on my convex dashboard I can see the DB tables have been created on the production instance.

erquhart•4mo ago

You said you can log in, but you can’t populate any data. Does that mean you can read but can’t write? Are you using Convex Auth for login? It sounds like some amount of convex functionality is working in production, just confirming whether that’s the case.

Rune DarkfireOP•4mo ago

I'm using clerk for auth and I have no idea if I can read because the DB is empty (so there's nothing to be read)

Clever Tagline•4mo ago

Are there any errors in the runtime logs in the Vercel deployment?

erquhart•4mo ago

If you click a button and see no activity, I would add some explicit logging. Log that the click occurred, log values from inside the click handler function, figure out what’s what. You can try/catch your mutation calls, log what the mutations return, ensure that they’re even being called in the first place.

Rune DarkfireOP•4mo ago

zero that I've seen @erquhart thanks for the suggestion on logging Now, I've been able to go through my whole logs and see that what my code is doing is correct/expected, it is just getting to the point of executing mutation code and just... falling flat. Literally does nothing on an addResourceName call. No error messages, no nothing... just doesn't do it, and execution halts, my console.logs after these calls aren't reached. I don't see how/where I'm supposed to get info on what's going on... there's nothing in vercel logs, nothing in dev console Ah HA - I finally noticed that there was a clerk call that was failing in the dev console. Turns out, I had not set up my JWT template for my production deployment of clerk, it was only set up for our dev deployment. This fixed when convex was trying to authenticate to clerk (which is does for nearly every call) and then trying to add stuff. So now I'm getting a lot further than before. But now something really strange is happening :

Rune DarkfireOP•4mo ago

I am getting successful add queries running, but then when I go check the DB, they are not there! 🤦‍♂️ what could be happening???

erquhart•4mo ago

I would log from the add query to make sure it’s actually adding Really, logging is how you troubleshoot all of this.

Rune DarkfireOP•4mo ago

hot on the trail of that, I discovered this is happening :

const user = await ctx.auth.getUserIdentity()
      if (user === null) {
        console.log('not getting user auth!')
        return null
      }

const user = await ctx.auth.getUserIdentity()
      if (user === null) {
        console.log('not getting user auth!')
        return null
      }

so now I have to figure out why that is. I feel like clerk is set up properly but perhaps it still isn't 😦

erquhart•4mo ago

I can help more when I get to my machine, just a minute

Rune DarkfireOP•4mo ago

@erquhart all seems good now 👍 it was all issues with clerk, didn't set up a new auth provider for our production deployment (in addition to the problems above)

erquhart•4mo ago

Awesome, glad you're up and running

Can't deploy convex to production with vercel correctly.

Did you find this page helpful?