Cómo dejar los links compartidos con el dominio correcto: canonical, og:url y barra final

En vendear, cada negocio tiene su vidriera con su propio link, y ese link es lo que el dueño comparte por WhatsApp e Instagram. El dominio que aparece en ese link no lo escribe nadie a mano: sale de una variable de entorno, y de ahí pasa al canonical, al og:url, al sitemap y al botón de copiar del panel.

Si esa variable está mal, se rompen todos a la vez. Y hay dos formas comunes de que esté mal:

• Una barra final. https://www.vendear.com/ más /es/<negocio> arma https://www.vendear.com//es/<negocio>. Funciona en el navegador, pero es otra URL para los buscadores y se ve rota en el chat.
• El host de Vercel. Si la variable se cargó cuando el sitio todavía no tenía dominio propio, sigue diciendo https://<proyecto>.vercel.app, y cada link compartido sale con ese host.

Nos pasaron las dos al mismo tiempo: los links salían como https://<proyecto>.vercel.app//es/<negocio>.

La función

Todo pasa por un solo lugar, src/config/brand.js:

export const DEFAULT_SITE_URL = "https://www.vendear.com";

export function normalizeSiteUrl(raw, vercelEnv) {
  const value = String(raw || "").trim().replace(/\/+$/, "");
  if (!value) return DEFAULT_SITE_URL;
  // Un *.vercel.app en producción es config vieja, no una elección: el sitio
  // tiene dominio propio. En previews y en local sí vale.
  if (vercelEnv === "production" && /\.vercel\.app$/i.test(value)) return DEFAULT_SITE_URL;
  return value;
}

export const BRAND = {
  baseUrl: normalizeSiteUrl(
    process.env.NEXT_PUBLIC_SITE_URL,
    process.env.NEXT_PUBLIC_VERCEL_ENV || process.env.VERCEL_ENV
  ),
  // …
};

Hay tres decisiones en esas seis líneas.

1. Se recorta la barra, no se confía en quien la carga

replace(/\/+$/, "") saca todas las barras finales. Pedirle a quien configura el proyecto que no la ponga no sirve: una variable se copia y se pega, y la barra final es invisible en un formulario. Es más barato normalizarla siempre.

2. Un host de Vercel en producción es un error, en un preview no

En producción, un *.vercel.app no es una elección: el sitio tiene dominio propio y ese valor quedó de antes. Por eso se ignora y se usa el dominio por defecto. En un preview, en cambio, el host de Vercel es justo el que quieres: los links tienen que llevar al preview, no a producción. La función mira el entorno para decidir.

Un detalle: se lee NEXT_PUBLIC_VERCEL_ENV antes que VERCEL_ENV porque este archivo también lo importa el panel, que corre en el navegador, y ahí sólo llegan las variables con prefijo público.

3. www, no el dominio desnudo

vendear.com responde con un redirect 308 a www.vendear.com. Puedes comprobarlo:

curl -s -o /dev/null -w "%{http_code} %{redirect_url}\n" https://vendear.com/es/almacendemo
# 308 https://www.vendear.com/es/almacendemo

Si el canonical y el og:url apuntaran al dominio desnudo, cada crawler (el de los buscadores y el que arma la vista previa en WhatsApp o Facebook) tendría que seguir ese redirect para llegar a la página. Algunos lo siguen, pero un salto de menos es un punto de falla de menos. El valor por defecto es la URL que contesta 200 directamente.

Un solo lugar para todos

El beneficio real no está en la función sino en que todo la use. En vendear, BRAND.baseUrl alimenta:

• metadataBase del layout, de donde Next.js arma el canonical y el og:url;
• la URL de la imagen de vista previa (/api/og/<negocio>);
• sitemap.xml, robots.txt y llms.txt;
• los datos estructurados (JSON-LD) de la home;
• el link que el dueño copia desde su panel.

Antes, el panel armaba su link por su cuenta. Ahora no hay dos caminos que puedan contradecirse.

Cómo comprobarlo

Mira lo que lee un crawler, no lo que muestra el navegador:

curl -s https://www.vendear.com/es/almacendemo \
  | grep -o '<link rel="canonical"[^>]*>\|<meta property="og:url"[^>]*>'

<link rel="canonical" href="https://www.vendear.com/es/almacendemo"/>
<meta property="og:url" content="https://www.vendear.com/es/almacendemo"/>

Sin barra doble y sin host de Vercel. Medido el 5 de octubre de 2026.

Si tu sitio arma URLs absolutas a partir de una variable, vale la pena revisar esas dos líneas. Y para ver cómo llega un link compartido, abre www.vendear.com/es/almacendemo y compártelo en un chat.