other-emerald

Configuring server.allowedHosts for tunneling

I am building an API route to handle webhook events. For local development, I need to configure a tunnel solution (e.g., ngrok, tunnelmole) to receive the events. In recent versions, I encounter this error:

Blocked request. This host ("[subdomain].tunnelmole.net") is not allowed.  
To allow this host, add "[subdomain].tunnelmole.net" to `server.allowedHosts` in vite.config.js.

Blocked request. This host ("[subdomain].tunnelmole.net") is not allowed.  
To allow this host, add "[subdomain].tunnelmole.net" to `server.allowedHosts` in vite.config.js.

However, the server option is not available in the Vite configuration, so there is no way to pass the allowedHosts configuration. How can I resolve this issue? Is there any workaround ?

9 Replies

robust-apricot•8mo ago

currently no will be possible once we have removed Vinxi

other-emeraldOP•8mo ago

Thank you, Is there an estimated release date for the removal of Vinxi ? I can't find it in the Roadmap (https://github.com/orgs/TanStack/projects/4/views/3?filterQuery=vinxi)

robust-apricot•8mo ago

no timeline. but it's our top priority just out of interest, what are you building here that needs webhooks?

other-emeraldOP•8mo ago

I'm building a SaaS for lawyers to automatically review their legal cases, which is typically a tedious process in my region. We're integrating Mercado Pago to manage subscriptions, and we need webhooks to handle payment events https://www.mercadopago.com.co/developers/en/docs/your-integrations/notifications/webhooks

silky-coral•8mo ago

the zod schema appears to allow for it (see

.and(z.custom<ServerOptions>())

.and(z.custom<ServerOptions>())

at the end of the schema)? The parsed result gets spread into vinxi createApp. Adding 'vite.server.allowedHosts' to app.config.ts worked for me if I use @ts-ignore. Not a great work around obviously but here's the zod schema that parses 'server' in the config:

type ServerOptions_ = VinxiAppOptions['server'] & {
  https?: boolean | HTTPSOptions
}

type ServerOptions = {
  [K in keyof ServerOptions_]: ServerOptions_[K]
}

export const serverSchema = z
  .object({
    routeRules: z.custom<NitroOptions['routeRules']>().optional(),
    preset: z.custom<DeploymentPreset>().optional(),
    static: z.boolean().optional(),
    prerender: z
      .object({
        routes: z.array(z.string()),
        ignore: z
          .array(
            z.custom<
              string | RegExp | ((path: string) => undefined | null | boolean)
            >(),
          )
          .optional(),
        crawlLinks: z.boolean().optional(),
      })
      .optional(),
  })
  .and(z.custom<ServerOptions>())

type ServerOptions_ = VinxiAppOptions['server'] & {
  https?: boolean | HTTPSOptions
}

type ServerOptions = {
  [K in keyof ServerOptions_]: ServerOptions_[K]
}

export const serverSchema = z
  .object({
    routeRules: z.custom<NitroOptions['routeRules']>().optional(),
    preset: z.custom<DeploymentPreset>().optional(),
    static: z.boolean().optional(),
    prerender: z
      .object({
        routes: z.array(z.string()),
        ignore: z
          .array(
            z.custom<
              string | RegExp | ((path: string) => undefined | null | boolean)
            >(),
          )
          .optional(),
        crawlLinks: z.boolean().optional(),
      })
      .optional(),
  })
  .and(z.custom<ServerOptions>())

other-emeraldOP•7mo ago

It did work, thank you for the workaround @spencer !

rising-crimson•7mo ago

Here's how you can do it without using tsignore. Just break out the vite config instead of doing it inline

stuck-chocolate•7mo ago

Thanks all! I needed this as well as I'm calling my local development API via ngrok from my Convex backend. Lifesaver

absent-sapphire•7mo ago

Super helpful for me too, thanks!

Gaming

Programming

Configuring server.allowedHosts for tunneling

Did you find this page helpful?