#Unreliable form submissions on vercel ISR and Astro DB

13 messages · Page 1 of 1 (latest)

magic robin
#

I have a form that lives at /dashboard/submit/

It works unreliably. It's using astro DB and hosted on Vercel using ISR.

I've added the url to ISR exclusions but its still somehow using isr cache i believe.

import { defineConfig } from 'astro/config';
import tailwind from "<@&1055234544183287879>/tailwind";
import db from "<@&1055234544183287879>/db";
import react from "<@&1055234544183287879>/react";
import clerk from "astro-clerk-auth";
import vercel from "<@&1055234544183287879>/vercel/serverless";

export default defineConfig({
integrations: [tailwind(), db(), react(), clerk()],
output: "server",
adapter: vercel({
webAnalytics: { enabled: true },
isr: {
expiration: 60 * 60 * 8,
exclude: ["/dashboard/(.*)", "/dashboard/", "/dashboard", "/dashboard/submit", "/dashboard/submit/", "/sign-in", "/sign-up"]
}
})
});

Due to this issue it seems to work quite unreliably. Works reliably in development, but not in production.

What can I do to make it more reliable? Note its posting the form as status 200, but nothing gets into the database. It has a success redirection which also sometimes works, sometimes doesnt.

I want to remove ISR from the /dashboard/ paths but its not doing that. How can i solve this?

uneven anvilBOT
#

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

#

Based on the information provided, it seems like you're experiencing issues with form submissions when using Astro DB and Vercel's Incremental Static Regeneration (ISR). You've attempted to exclude the /dashboard/ paths from ISR, but it appears to not be working as expected.

Firstly, ensure that your isr.exclude configuration is correctly set up. According to the Astro documentation (https://docs.astro.build/en/guides/integrations-guide/vercel#isr-cache-invalidation), you can exclude particular routes from caching entirely by providing an array of routes to the exclude property.

Your current configuration seems to be trying to exclude multiple variations of the /dashboard/ path. However, it's important to note that the exclude property does not support regex or wildcard characters. Instead, it matches the exact paths provided.

If you want to exclude all routes under /dashboard/, you might need to use a dynamic route segment like /dashboard/**...slug]. This was a feature request discussed in a [Github issue** (https://github.com/withastro/astro/issues/10492) and was implemented in a later update.

Here's how your configuration might look:

export default defineConfig({
  integrations: [tailwind(), db(), react(), clerk()],
  output: "server",
  adapter: vercel({
    webAnalytics: { enabled: true },
    isr: {
        expiration: 60 * 60 * 8,
        exclude: ["/dashboard/[...slug]", "/sign-in", "/sign-up"] 
    }
  })
});

This configuration should exclude all routes under /dashboard/ from ISR.

If you're still experiencing issues, it might be due to other factors such as the form submission handler or the database connection. You might want to check the server logs for any errors or unusual behavior.

#

Also, it's worth noting that Astro DB is not yet compatible with Cloudflare out of the box as mentioned in a Github issue (https://github.com/withastro/astro/issues/10668). If you're using Cloudflare, this might be causing some issues.

If the problem persists, consider opening an issue on the Astro Github repository for further assistance.

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

#

@magic robin kapa.ai is still learning and improving, please let us know how it did by reacting below

magic robin
#

With "/dashboard/[...slug]" Do i need such a folder? Or this is just the way to mark the path as anything under here dont cache?

#

@uneven anvil With "/dashboard/[...slug]" Do i need such a folder? Or this is just the way to mark the path as anything under here dont cache?

uneven anvilBOT
#

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

#

The /dashboard/**...slug] syntax is used to denote a [dynamic route** (https://docs.astro.build/en/guides/routing/#dynamic-routes) in Astro. This means that it will match any path that starts with /dashboard/, regardless of what follows.

You don't necessarily need to have a physical folder named [...slug] in your project. This is just a placeholder that represents any possible route that could exist under /dashboard/.

So, when you use /dashboard/[...slug] in the exclude array of your ISR configuration, it means that you want to exclude all routes under /dashboard/ from ISR, regardless of what the specific path is.

Here's how your configuration might look:

export default defineConfig({{
  integrations: [tailwind(), db(), react(), clerk()],
  output: "server",
  adapter: vercel({{
    webAnalytics: {{ enabled: true }},
    isr: {{
        expiration: 60 * 60 * 8,
        exclude: ["/dashboard/[...slug]", "/sign-in", "/sign-up"] 
    }}
  }})
}});

This configuration should exclude all routes under /dashboard/ from ISR.

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

#

@magic robin kapa.ai is still learning and improving, please let us know how it did by reacting below

magic robin
#

@uneven anvil still not working. any other ideas?

Also do you know if in vercel logs:
"Function /_isr" is still using ISR even though it shouldnt be?

uneven anvilBOT
#

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

#

I'm sorry to hear that you're still experiencing issues.

The "Function /_isr" log in Vercel indicates that the ISR function is being invoked. If you're seeing this for routes that you've excluded from ISR, it might suggest that the exclusion isn't working as expected.

Here are a few things you could try:

  1. Check your Astro and Vercel versions: Ensure you're using the latest versions of Astro and the @astrojs/vercel adapter. The ability to exclude dynamic routes from ISR was added in a recent update (https://github.com/withastro/astro/issues/10492).

  2. Review your astro.config.mjs file: Make sure there are no syntax errors or misconfigurations that could be causing issues.

  3. Test without ISR: Temporarily disable ISR in your Vercel adapter configuration by setting isr to false. This can help determine if ISR is indeed the cause of the issue.

export default defineConfig({
  integrations: [tailwind(), db(), react(), clerk()],
  output: "server",
  adapter: vercel({
    webAnalytics: { enabled: true },
    isr: false
  })
});
  1. Debug in a local environment: Try to reproduce the issue in a local environment. This can sometimes make it easier to identify and fix issues.

If none of these suggestions help, I recommend opening an issue on the Astro GitHub repository. Provide as much detail as possible about your issue, including your astro.config.mjs file and any relevant logs. The Astro team or community may be able to provide further assistance.

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