'use server'
'use server'
marque les fonctions côté serveur qui peuvent être appelées par du code React côté client.
Référence
'use server'
Ajoutez 'use server';
tout en haut d’une fonction asynchrone pour indiquer que cette fonction peut être appelée par du code côté client.
async function addToCart(data) {
'use server';
// ...
}
// <ProductDetailPage addToCart={addToCart} />
Cette fonction peut être passée au client. Lorsqu’elle est appelée par le client, elle fera un appel réseau au serveur en lui passant une copie sérialisée des arguments qu’elle a reçus. Si la fonction serveur renvoie une valeur, celle-ci sera sérialisée et renvoyée au client.
Vous pouvez aussi utiliser 'use server';
tout en haut d’un fichier pour indiquer que tous les exports de ce fichier sont des fonctions serveur asynchrones qui peuvent être utilisées depuis n’importe où, y compris par import dans des fichiers de composants côté client.
Limitations
- Gardez à l’esprit que les paramètres des fonctions marquées par
'use server'
sont entièrement contrôlés par le client. Pour une meilleure sécurité, traitez-les toujours commes des entrées non vérifiées, et assurez-vous de les valider et d’en échapper le contenu lorsque nécessaire. - Pour éviter toute confusion qui pourrait résulter du mélange entre codes côté client et côté serveur au sein d’un même fichier,
'use server'
ne peut être utilisée que dans des fichiers côté serveur. Les fonctions résultantes peuvent être passées à des composants côté client via leurs props. - Puisque les appels réseaux sous-jacents sont intrinsèquement asynchrones,
'use server'
ne peut être utilisée que pour des fonctions asynchrones. - Les directives telles que
'use server'
doivent être placées au tout début du fichier, au-dessus de tout import et de quelque autre code que ce soit (à l’exception des commentaires, qui peuvent apparaître avant). Elles doivent utiliser des apostrophes ('
) ou guillemets ("
), pas des apostrophes inverses (`
). (Le format de directive'use xyz'
n’est pas sans rappeler la convention de nommageuseXyz()
des Hooks, mais c’est là une simple coïncidence.)