SEO con Next.js: come faccio a farmi citare da ChatGPT?

Quale crawler di OpenAI devo consentire?

OAI-SearchBot è quello che decide se la ricerca di ChatGPT può mostrare il tuo sito. I tre hanno compiti diversi, quindi bloccali o consentili separatamente.

// app/robots.ts
import type { MetadataRoute } from "next";

export default function robots(): MetadataRoute.Robots {
  return {
    rules: [
      { userAgent: "*", allow: "/" },
      // ChatGPT search: must be allowed to be shown in answers
      { userAgent: "OAI-SearchBot", allow: "/" },
      // Model training: your choice, it does not decide search
      { userAgent: "GPTBot", allow: "/" },
    ],
    sitemap: "https://www.example.com/sitemap.xml",
  };
}

Perché il testo deve essere generato sul server?

Perché i crawler di ChatGPT leggono l'HTML che il tuo server invia e non eseguono JavaScript. Nell'App Router le pagine sono Server Components per impostazione predefinita; il testo recuperato in un Client Component dopo il caricamento manca in quell'HTML. Mantieni la pagina come Server Component e sposta nei file "use client" solo le parti interattive.

Cosa devono includere i metadati di ogni pagina?

Un titolo e una descrizione unici, un URL canonical e, nei siti multilingua, le alternative per lingua. generateMetadata le costruisce per ogni pagina; Next.js trasforma le alternative in link rel="canonical" e hreflang. Il JSON-LD va nella pagina come semplice tag script, con "<" sostituito come mostra la documentazione di Next.js, e deve dire le stesse cose del testo visibile.

// app/guides/[slug]/page.tsx (a Server Component: no "use client")
import type { Metadata } from "next";

export async function generateMetadata({ params }: { params: Promise<{ slug: string }> }): Promise<Metadata> {
  const { slug } = await params;
  const page = await getPage(slug);
  return {
    title: page.title,
    description: page.description,
    alternates: {
      canonical: `/guides/${slug}`,
      languages: { "pt-BR": `/pt/guides/${slug}`, es: `/es/guides/${slug}` },
    },
  };
}

export default async function Page({ params }: { params: Promise<{ slug: string }> }) {
  const { slug } = await params;
  const page = await getPage(slug);
  const jsonLd = { "@context": "https://schema.org", "@type": "Article", headline: page.title };
  return (
    <article>
      <script type="application/ld+json"
        dangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd).replace(/</g, "\\u003c") }} />
      <h1>{page.title}</h1>
      <p>{page.answer}</p>
    </article>
  );
}

Come lo testo come farebbe un crawler?

Scarica la pagina online senza browser e cerca il testo della risposta, il titolo, il canonical e il JSON-LD. Se il testo non è nell'HTML grezzo, ChatGPT non può citarlo.

# 1. The text is in the raw HTML (no JavaScript run)
curl -s -A "OAI-SearchBot" https://www.example.com/guides/my-page | grep -i "a sentence from the answer"

# 2. Title, canonical and JSON-LD are there too
curl -s https://www.example.com/guides/my-page | grep -iE "<title>|rel=\"canonical\"|ld\+json"

# 3. robots.txt and sitemap answer
curl -s https://www.example.com/robots.txt
curl -s https://www.example.com/sitemap.xml | grep -c "<loc>"

Con una configurazione perfetta vengo citato?

No. La configurazione rende le pagine leggibili e idonee; ChatGPT sceglie le fonti in base a quanto bene una pagina risponde alla domanda. Il contenuto deve comunque essere la risposta più chiara a ciò che chiedono i tuoi acquirenti.