Dépannage

Le lien magique me déconnecte aussitôt#

Les modèles d'e-mail Supabase sont encore ceux par défaut, qui renvoient la session dans un fragment d'URL que votre serveur ne voit jamais. Réécrivez les trois pour utiliser ?token_hash={{ .TokenHash }}. Voir Authentification.

Je me connecte, puis je suis déconnecté à la page suivante#

proxy.ts ne s'exécute pas, ou ne correspond pas à la route. Les Server Components ne peuvent pas écrire de cookies, donc sans lui rien ne rafraîchit la session. Vérifiez le matcher en bas du fichier.

Si cela n'arrive que sur le callback, c'est que le client y est lié à next/headers plutôt qu'à la réponse. Cette mutation ne survit pas à une redirection.

Le paiement renvoie 503#

STRIPE_SECRET_KEY est absente. C'est délibéré : l'application tourne sans Stripe pour que vous puissiez construire avant de facturer.

« Expired API Key provided »#

Vous avez activé le mode live, ce qui invalide les clés de test existantes. Recopiez les nouvelles clés de test depuis le tableau de bord.

Le paiement a marché mais rien ne s'est passé#

Regardez le journal d'événements du tableau de bord Stripe, pas le vôtre. Il montre la réponse renvoyée par votre webhook.

• 400 : signature invalide. Le secret dans votre environnement appartient à un autre endpoint.
• 503 : STRIPE_WEBHOOK_SECRET n'était pas définie au démarrage du processus. Définissez-la et redéployez ; un processus qui tourne ne la prendra pas.
• 200 mais rien en base : le type d'événement n'est pas activé sur l'endpoint.

Toutes les routes renvoient 500 et les logs ne disent rien#

Une variable d'environnement est réglée sur une chaîne vide. ?? ne retombe pas sur "", donc new URL("/x", "") lève, et dans le layout racine cela emporte toutes les pages. Supprimez la variable plutôt que de la vider.

Une variable NEXT_PUBLIC est undefined dans le navigateur#

Elle est marquée Sensitive sur Vercel, donc elle n'est pas insérée dans le bundle. Passez-la en Encrypted et redéployez.

Les bordures sont noires et je n'ai rien demandé de tel#

Vous avez utilisé une classe de couleur dont le token n'est pas déclaré dans @theme. Tailwind n'émet rien, et border retombe sur currentColor. Déclarez le token. Vérifiez le style calculé plutôt que la capture d'écran ; celle-ci est facile à regarder sans voir.

Le texte affiche {name} littéralement#

Des accolades simples. Le format de message attend {{name}}, et un emplacement à accolade simple compile sans avertissement. Voir Internationalisation.

Une clé de message existe mais vaut undefined#

Elle contient un underscore. _ est le séparateur de contexte, donc meta_title compile comme une variante de meta. Renommez en camelCase.

La page est plus large que le téléphone#

Presque toujours une grille à une colonne dimensionnée sur max-content. Ajoutez grid-cols-1. Le deuxième cas le plus fréquent est un enfant flex sans min-w-0, qui refuse de rétrécir sous son contenu.

Un formulaire ne fait rien, en silence#

Cherchez un router.refresh() qui se déclenche à proximité. Une navigation pendant un refresh laisse le routeur avec un rendu de Server Components qui n'a plus de destination, et la page d'arrivée peut cesser de s'hydrater. React le signale comme l'erreur minifiée #441, qui ne dit rien d'utile en production.

Un élément animé ignore sa transformation#

Motion possède transform sur tout élément qu'il anime. Un style={{ transform }} sur le même élément est écarté. Animez la valeur, ou enveloppez l'élément.

Toujours bloqué#

Écrivez à hello@tryshipnow.com avec ce que vous attendiez, ce qui s'est passé, et l'identifiant de requête s'il y en a un. Une personne le lit.