Maison  >  Article  >  développement back-end  >  Comment rediriger les utilisateurs après la connexion à l'aide de l'API JavaScript Fetch ?

Comment rediriger les utilisateurs après la connexion à l'aide de l'API JavaScript Fetch ?

Linda Hamilton
Linda Hamiltonoriginal
2024-10-18 22:37:30782parcourir

How to Redirect Users After Login Using the JavaScript Fetch API?

Comment rediriger l'utilisateur vers une autre page après la connexion à l'aide de l'API JavaScript Fetch ?

Lors de l'utilisation de l'API fetch() pour effectuer une requête POST à ​​un serveur pour la connexion , la redirection de l'utilisateur vers une autre page peut être réalisée en utilisant l'une des options suivantes :

Option 1 : Renvoyer la réponse de redirection

Par défaut, la fonction fetch() en JavaScript suit automatiquement les redirections. Ainsi, lorsque le serveur renvoie une RedirectResponse, la requête fetch() suivra la redirection et renverra la réponse de l'URL de redirection.

Pour déterminer si la réponse est le résultat d'une redirection, vérifiez si Response.redirected est vrai. Si tel est le cas, Response.url contiendra l'URL finale après toute redirection. Utilisez window.location.href ou window.location.replace() pour rediriger l'utilisateur vers l'URL cible.

Option 2 : renvoyer JSON avec l'URL de redirection

Au lieu de renvoyer une réponse de redirection, le Le serveur peut renvoyer une réponse JSON contenant l'URL cible sous forme de paire clé-valeur (par exemple, { "url": "/welcome" }). Côté client, vérifiez si la réponse JSON inclut la clé url, et si c'est le cas, utilisez window.location.href ou window.location.replace() pour rediriger l'utilisateur.

Option 3 : Utiliser le formulaire HTML

Si l'utilisation de fetch() n'est pas requise, envisagez d'utiliser un formulaire HTML traditionnel pour vous connecter. Lorsque l'utilisateur soumet le formulaire, une requête POST sera envoyée au serveur. Le serveur peut alors renvoyer une RedirectResponse et le navigateur redirigera automatiquement l'utilisateur vers l'URL cible.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn