Authentification native

Configuration et paramètres

Avant toute étape, lisez Avant de commencer et Principes de base du terminal. Ces instructions supposent que vous avez ouvert le monorepo supastack complet dans VS Code ; sa racine package.json marque la racine du référentiel. Dans les commandes pnpm, un package d'espace de travail est une application ou un dossier de code partagé ; dans le produit, un espace de travail est le conteneur de données et la limite de sécurité d'une équipe. corepack pnpm --filter ... sélectionne un package dans le monorepo tandis que les commandes sont exécutées à partir de sa racine. Si vous avez ouvert uniquement un dossier mobile ou de bureau synchronisé, il ne contient pas le backend Web, la configuration Docker ou les scripts racine : exécutez le backend à partir de ce monorepo ou d'un serveur hébergé accessible et utilisez les propres scripts du dossier de plateforme. Une variable d'environnement est un paramètre nommé stocké dans un fichier .env local ou dans votre tableau de bord d'hébergement ; redémarrez l'application concernée après l'avoir modifiée et conservez les secrets du serveur en dehors des valeurs NEXT_PUBLIC_ et EXPO_PUBLIC_.

1. Ouvrez apps/mobile/src/auth/client.ts et apps/mobile/src/auth/mobile-auth-configuration.ts dans VS Code pour rechercher le flux de connexion existant.

2. Mettez EXPO_PUBLIC_API_URL et EXPO_PUBLIC_APP_SCHEME dans apps/mobile/.env.local et assurez-vous que le serveur Web dispose de ses propres paramètres dans apps/web/.env.local..

3. Depuis la racine, démarrez Web avec le corepack pnpm --filter @supastack/web dev, puis dans un autre terminal, démarrez Expo avec le corepack pnpm --filter @supastack/mobile start. Attendu : une connexion test ouvre le navigateur et revient à l'application mobile. Sur un téléphone physique, utilisez l'adresse Wi-Fi/LAN accessible de l'ordinateur pour le API ; phone-localhost désigne le téléphone lui-même.

L’application mobile utilise l’intégration Expo de Better Auth et le stockage sécurisé natif. L’origine API et le schéma d’application doivent correspondre à la configuration native et au parcours de retour autorisé par le serveur d’authentification.

EXPO_PUBLIC_API_URL=https://your-api.example
EXPO_PUBLIC_APP_SCHEME=supastack

Commandes à copier

Suivez les commentaires pour voir dans quel dossier une commande s'exécute. Si deux terminaux sont étiquetés, ouvrez deux fenêtres de terminal et laissez la première commande s'exécuter pendant que vous utilisez la seconde.

# Terminal 1 — Web API (from the monorepo root):
corepack pnpm --filter @supastack/web dev

# Terminal 2 — Expo app (from the monorepo root):
corepack pnpm --filter @supastack/mobile start

Processus d’implémentation

Suivez le client d’authentification natif existant au lieu de copier les hypothèses de cookies web dans l’application mobile. Ouvrez l’authentification du fournisseur avec le flux de navigateur configuré, gérez son retour, puis résolvez la session authentifiée avant d’afficher les actions protégées.

Gardez une connexion annulée distincte d’une connexion réussie. Les membres peuvent activer le verrouillage biométrique de l’application (Face ID, Touch ID ou empreinte digitale dans apps/mobile/src/security/app-lock.ts sous Paramètres → Sécurité) pour protéger le retour au premier plan. Effacez la présentation locale de l’utilisateur précédent ainsi que le cache de lecture hors ligne limité à l’espace de travail (apps/mobile/src/offline/) lors de la déconnexion, et vérifiez que la session serveur ne peut plus exécuter d’actions protégées.

Vérification et dépannage

Si la connexion ouvre un navigateur mais ne revient pas à l'application, vérifiez que EXPO_PUBLIC_APP_SCHEME correspond au schéma dans apps/mobile/app.config.ts.. Si l'application ne peut pas atteindre le serveur, remplacez localhost par l'adresse LAN de l'ordinateur, confirmez que les deux appareils utilisent le même réseau, puis redémarrez Expo après avoir modifié apps/mobile/.env.local.. Expo Go est un aperçu de l'interface utilisateur ; l'acceptation d'achat native nécessite une version de développement EAS.

Sur la compilation prévue, exercez les retours après un démarrage à froid, le retour vers une application déjà ouverte, une connexion annulée et les sessions expirées. Si le navigateur revient mais que l’application reste déconnectée, vérifiez la correspondance du schéma et l’accès à l’API avant de modifier la configuration du fournisseur.