Actions serveur dans React 19 et Next.js

Les actions serveur sont des fonctions asynchrones qui s’exécutent sur le serveur, et non dans le navigateur. Elles sont marquées par la directive 'use server', placée au début du fichier ou au début du corps de la fonction, afin d’indiquer au framework que cette fonction ne doit jamais s’exécuter côté client.

Comme les actions serveur s’exécutent sur le serveur, elles ont accès à l’intégralité du contexte serveur : connexions à la base de données, secrets d’environnement, données de session et ressources du système de fichiers. Cela diffère fondamentalement des composants client, qui ne peuvent accéder qu’à ce que le navigateur expose.

Lorsqu’un composant client appelle une action serveur, Next.js effectue automatiquement une requête HTTP POST vers un point de terminaison RSC spécial. Le cadre gère toute la sérialisation des arguments et la couche de transport ; vous n’écrivez donc jamais manuellement d’appels de récupération pour ces modifications.

Les actions serveur remplacent le besoin de routes d’API dans de nombreux scénarios de modification. L’action elle-même est le point de terminaison : vous définissez la logique une seule fois sous la forme d’une fonction serveur et vous l’appelez directement depuis le composant client, comme s’il s’agissait d’une fonction locale.

Les actions serveur étaient initialement un concept propre à Next.js, mais React 19 les élève au rang de fonctionnalité React de premier ordre. Cela signifie que des empaqueteurs et des cadres autres que Next.js peuvent implémenter le même modèle en suivant la spécification React.

Les actions serveur sont expérimentales dans React 19 RC, mais elles sont stables dans le routeur d’application de Next.js 14+ depuis leur introduction. Si vous développez aujourd’hui une application destinée à la production avec le routeur d’application de Next.js, les actions serveur constituent un modèle entièrement pris en charge et recommandé.

L’une des propriétés de sécurité les plus importantes des actions serveur est que les secrets n’atteignent jamais le navigateur. Les variables d’environnement, comme les mots de passe de base de données et les clés d’API utilisées dans une action serveur, ne sont jamais incluses dans le paquet client, car le corps de la fonction n’est jamais envoyé au navigateur.

Les éléments de formulaire HTML acceptent directement une action serveur via l’attribut action : <form action={myServerAction}>. React intercepte la soumission du formulaire et appelle l’action serveur avec les données du formulaire, ce qui permet d’effectuer une modification côté serveur sans logique JavaScript côté client.

Lorsqu’une action serveur est déclenchée, React sérialise les arguments de l’action dans le corps d’une requête POST. Le serveur les désérialise, exécute la fonction, sérialise la valeur de retour et la renvoie. Seules les valeurs sérialisables (chaînes, nombres, tableaux, objets simples) peuvent franchir la limite.

Vous pouvez définir une action serveur au niveau du module dans un fichier contenant 'use server' en première ligne, ou directement dans un composant serveur en plaçant 'use server' au début de la fonction asynchrone. Les deux approches produisent le même résultat : une fonction appelable uniquement côté serveur.

Les composants client importent et appellent les actions serveur comme des fonctions asynchrones ordinaires. La syntaxe d’appel est identique à celle d’un appel de fonction asynchrone local, mais l’exécution se déroule entièrement sur le serveur. Cette abstraction garde les composants client propres et exempts de code répétitif lié à la récupération.

Laquelle des propositions suivantes décrit le mieux le modèle de sécurité des actions serveur ?

Les actions serveur sont des fonctions asynchrones côté serveur marquées avec 'use server'. Elles exploitent le contexte serveur, notamment les connexions à la base de données et les secrets d’environnement. Next.js gère automatiquement le transport HTTP, et React 19 en fait une fonctionnalité indépendante du cadre utilisé. Les formulaires peuvent les utiliser directement via l’attribut action, et les secrets qu’elles contiennent n’atteignent jamais le navigateur.