Résolutions d'erreurs CORS - Historique des versions

Abdoulaye le 19 octobre 2025 à 18:20

2025-10-19T18:20:21Z

@@ Ligne 23 : / Ligne 23 : @@
 [[index.php?title=Catégorie:React]]
-. Sur plesk lorsqu'on lance l'application depuis un docker avec un front discossié du back j'ai dû gérer les entêtes CORS depuis les configurations Apache directement. Pour cela j'ai du désactiver le CORS sur laravel, pour cela il suffit de commenter ou retirer la ligne concernant le middleware HandleCors dans app/http/kernel.php. Puis aller sur le domaine connecté au conteneur du back-end, dans les paramètres apaches et nginx => Additional Apache directives, mettre pour le http et le https, un code similaire :
+. Sur plesk lorsqu'on lance l'application depuis un docker avec un front discossié du back j'ai dû gérer les entêtes CORS depuis les configurations Apache directement. Pour cela j'ai du désactiver le CORS sur laravel, pour cela il suffit de commenter ou retirer la ligne concernant le middleware HandleCors dans app/http/kernel.php. Puis aller sur le domaine connecté au conteneur du back-end, dans les paramètres apaches et nginx => Additional Apache directives, mettre pour le http et le https, un code similaire : <syntaxhighlight lang="sh">
-Attention à bien renseigner le domaine front-end autorisé
+# Activer les en-têtes CORS

Abdoulaye le 19 octobre 2025 à 18:19

2025-10-19T18:19:45Z

← Version précédente		Version du 19 octobre 2025 à 18:19
Ligne 25 :		Ligne 25 :
	4. Sur plesk lorsqu'on lance l'application depuis un docker avec un front discossié du back j'ai dû gérer les entêtes CORS depuis les configurations Apache directement. Pour cela j'ai du désactiver le CORS sur laravel, pour cela il suffit de commenter ou retirer la ligne concernant le middleware HandleCors dans app/http/kernel.php. Puis aller sur le domaine connecté au conteneur du back-end, dans les paramètres apaches et nginx => Additional Apache directives, mettre pour le http et le https, un code similaire :		4. Sur plesk lorsqu'on lance l'application depuis un docker avec un front discossié du back j'ai dû gérer les entêtes CORS depuis les configurations Apache directement. Pour cela j'ai du désactiver le CORS sur laravel, pour cela il suffit de commenter ou retirer la ligne concernant le middleware HandleCors dans app/http/kernel.php. Puis aller sur le domaine connecté au conteneur du back-end, dans les paramètres apaches et nginx => Additional Apache directives, mettre pour le http et le https, un code similaire :

	~~<code>~~
	~~# Activer le mode proxy~~
	~~ProxyRequests Off~~
	~~ProxyPreserveHost On~~

	~~# Activer les en-têtes CORS~~
	~~Header always set Access-Control-Allow-Origin "https://mondomainefront-end.example"~~
	~~Header always set Access-Control-Allow-Methods "GET, POST, PUT, DELETE, OPTIONS"~~
	~~Header always set Access-Control-Allow-Headers "Content-Type, Authorization, X-Requested-With"~~
	~~Header always set Access-Control-Expose-Headers "Authorization"~~
	~~Header always set Access-Control-Allow-Credentials "true"~~

	~~# Gérer les requêtes OPTIONS (preflight)~~
	~~RewriteEngine On~~
	~~RewriteCond %{REQUEST_METHOD} OPTIONS~~
	~~RewriteRule ^(.*)$ $1 [R=200,L]~~

	~~# Configuration pour les requêtes HTTP normales~~
	~~<Location />~~
	~~ProxyPass http://127.0.0.1:8000/~~
	~~ProxyPassReverse http://127.0.0.1:8000/~~
	~~</Location>~~
	~~</code>~~

	Attention à bien renseigner le domaine front-end autorisé		Attention à bien renseigner le domaine front-end autorisé

Abdoulaye le 19 octobre 2025 à 18:19

2025-10-19T18:19:11Z

← Version précédente		Version du 19 octobre 2025 à 18:19
Ligne 22 :		Ligne 22 :

	[[index.php?title=Catégorie:React]]		[[index.php?title=Catégorie:React]]

			4. Sur plesk lorsqu'on lance l'application depuis un docker avec un front discossié du back j'ai dû gérer les entêtes CORS depuis les configurations Apache directement. Pour cela j'ai du désactiver le CORS sur laravel, pour cela il suffit de commenter ou retirer la ligne concernant le middleware HandleCors dans app/http/kernel.php. Puis aller sur le domaine connecté au conteneur du back-end, dans les paramètres apaches et nginx => Additional Apache directives, mettre pour le http et le https, un code similaire :

			<code>
			# Activer le mode proxy
			ProxyRequests Off
			ProxyPreserveHost On

			# Activer les en-têtes CORS
			Header always set Access-Control-Allow-Origin "https://mondomainefront-end.example"
			Header always set Access-Control-Allow-Methods "GET, POST, PUT, DELETE, OPTIONS"
			Header always set Access-Control-Allow-Headers "Content-Type, Authorization, X-Requested-With"
			Header always set Access-Control-Expose-Headers "Authorization"
			Header always set Access-Control-Allow-Credentials "true"

			# Gérer les requêtes OPTIONS (preflight)
			RewriteEngine On
			RewriteCond %{REQUEST_METHOD} OPTIONS
			RewriteRule ^(.*)$ $1 [R=200,L]

			# Configuration pour les requêtes HTTP normales
			<Location />
			ProxyPass http://127.0.0.1:8000/
			ProxyPassReverse http://127.0.0.1:8000/
			</Location>
			</code>

			Attention à bien renseigner le domaine front-end autorisé

Abdoulaye le 20 juillet 2025 à 23:00

2025-07-20T23:00:22Z

← Version précédente		Version du 20 juillet 2025 à 23:00
Ligne 4 :		Ligne 4 :
	Bref, après une journée à tester mille et une solutions dont l'ajout des headers Acess-Control[....] dans la config d'Apache (.htaccess et config.d) et côté client en rajoutant des "Access-Control-Allow-Origin": "*" à l'en-tête de mes requêtes; je parviens à faire passer mes requêtes en '''retirant un slash ( / ) qui trainait à la fin de l'url de ma requête''' côté client react.		Bref, après une journée à tester mille et une solutions dont l'ajout des headers Acess-Control[....] dans la config d'Apache (.htaccess et config.d) et côté client en rajoutant des "Access-Control-Allow-Origin": "*" à l'en-tête de mes requêtes; je parviens à faire passer mes requêtes en '''retirant un slash ( / ) qui trainait à la fin de l'url de ma requête''' côté client react.

	[[Catégorie:React]]
			2. Vérifier le sanctum

			Si votre application front-end est hébergée sur un domaine différent, assurez-vous de configurer les paramètres CORS dans le fichier <code>config/sanctum.php</code>. Ajoutez votre domaine dans la section <code>stateful</code> :
			'stateful' => explode(',', env('SANCTUM_STATEFUL_DOMAINS', sprintf(
			'%s%s',
			'localhost,localhost:3000,127.0.0.1,127.0.0.1:8000,::1,<nowiki>https://abdoulaye-diallo.com'</nowiki>,
			Sanctum::currentApplicationUrlWithPort()
			))),


			3. Vérifier très bien la syntaxe de vos URL

			Encore plusieurs jours de perdus car incohérence dans les URL. Revérifier à plusieurs reprises que le front fait bien appel à l'api correctement.

			J'avais une erreur car mon front faisait appel à 'https://api.vtcprivetoure.fr/api<nowiki/>' alors que je devais appeler 'https://api.vtcprivetoure.fr/api<nowiki/>'. ici c'est le sous-domaine api qui m'a induit en erreur.

			[[index.php?title=Catégorie:React]]

Abdoulaye le 23 janvier 2024 à 19:37

2024-01-23T19:37:08Z

← Version précédente		Version du 23 janvier 2024 à 19:37
Ligne 4 :		Ligne 4 :
	Bref, après une journée à tester mille et une solutions dont l'ajout des headers Acess-Control[....] dans la config d'Apache (.htaccess et config.d) et côté client en rajoutant des "Access-Control-Allow-Origin": "*" à l'en-tête de mes requêtes; je parviens à faire passer mes requêtes en '''retirant un slash ( / ) qui trainait à la fin de l'url de ma requête''' côté client react.		Bref, après une journée à tester mille et une solutions dont l'ajout des headers Acess-Control[....] dans la config d'Apache (.htaccess et config.d) et côté client en rajoutant des "Access-Control-Allow-Origin": "*" à l'en-tête de mes requêtes; je parviens à faire passer mes requêtes en '''retirant un slash ( / ) qui trainait à la fin de l'url de ma requête''' côté client react.

	[[~~index.php?title=~~Catégorie:React]]		[[Catégorie:React]]

Abdoulaye le 23 janvier 2024 à 19:36

2024-01-23T19:36:50Z

← Version précédente		Version du 23 janvier 2024 à 19:36
Ligne 2 :		Ligne 2 :
	Dans des requêtes faites à une API via axios, je tombait pour certaines requêtes (et seulement certaines) sur des blocages CORS. Ce qui était encore plus étrange c'est que tout fonctionnait parfaitement quand mon api était hébergée en local, les problèmes sont apparus quand je l'ai hébergée en ligne.		Dans des requêtes faites à une API via axios, je tombait pour certaines requêtes (et seulement certaines) sur des blocages CORS. Ce qui était encore plus étrange c'est que tout fonctionnait parfaitement quand mon api était hébergée en local, les problèmes sont apparus quand je l'ai hébergée en ligne.

	Bref, après une journée à tester mille et une solutions dont l'ajout des headers Acess-Control[....] dans la config d'Apache (.htaccess et config.d) et côté client en rajoutant des "Access-Control-Allow-Origin": "*" à l'en-tête de mes requêtes; je parviens à faire passer mes requêtes en '''retirant un slash ( / ) qui trainait à la fin de l'url de ma requête'''.		Bref, après une journée à tester mille et une solutions dont l'ajout des headers Acess-Control[....] dans la config d'Apache (.htaccess et config.d) et côté client en rajoutant des "Access-Control-Allow-Origin": "*" à l'en-tête de mes requêtes; je parviens à faire passer mes requêtes en '''retirant un slash ( / ) qui trainait à la fin de l'url de ma requête''' côté client react.

	[[~~Category~~:React]]		[[index.php?title=Catégorie:React]]

Abdoulaye le 23 janvier 2024 à 19:36

2024-01-23T19:36:11Z

← Version précédente		Version du 23 janvier 2024 à 19:36
Ligne 3 :		Ligne 3 :

	Bref, après une journée à tester mille et une solutions dont l'ajout des headers Acess-Control[....] dans la config d'Apache (.htaccess et config.d) et côté client en rajoutant des "Access-Control-Allow-Origin": "*" à l'en-tête de mes requêtes; je parviens à faire passer mes requêtes en '''retirant un slash ( / ) qui trainait à la fin de l'url de ma requête'''.		Bref, après une journée à tester mille et une solutions dont l'ajout des headers Acess-Control[....] dans la config d'Apache (.htaccess et config.d) et côté client en rajoutant des "Access-Control-Allow-Origin": "*" à l'en-tête de mes requêtes; je parviens à faire passer mes requêtes en '''retirant un slash ( / ) qui trainait à la fin de l'url de ma requête'''.

			[[Category:React]]

Abdoulaye : Page créée avec « === Histoire 1 : React.js (1 journée de 9h passée à trouver la solution 😒) === Dans des requêtes faites à une API via axios, je tombait pour certaines requêtes (et seulement certaines) sur des blocages CORS. Ce qui était encore plus étrange c'est que tout fonctionnait parfaitement quand mon api était hébergée en local, les problèmes sont apparus quand je l'ai hébergée en ligne. Bref, après une journée à tester mille et une solutions dont l'aj... »

2024-01-23T19:34:54Z

Page créée avec « === Histoire 1 : React.js (1 journée de 9h passée à trouver la solution 😒) === Dans des requêtes faites à une API via axios, je tombait pour certaines requêtes (et seulement certaines) sur des blocages CORS. Ce qui était encore plus étrange c'est que tout fonctionnait parfaitement quand mon api était hébergée en local, les problèmes sont apparus quand je l'ai hébergée en ligne. Bref, après une journée à tester mille et une solutions dont l'aj... »

Nouvelle page

=== Histoire 1 : React.js (1 journée de 9h passée à trouver la solution 😒) ===
Dans des requêtes faites à une API via axios, je tombait pour certaines requêtes (et seulement certaines) sur des blocages CORS. Ce qui était encore plus étrange c'est que tout fonctionnait parfaitement quand mon api était hébergée en local, les problèmes sont apparus quand je l'ai hébergée en ligne.

Bref, après une journée à tester mille et une solutions dont l'ajout des headers Acess-Control[....] dans la config d'Apache (.htaccess et config.d) et côté client en rajoutant des "Access-Control-Allow-Origin": "*" à l'en-tête de mes requêtes; je parviens à faire passer mes requêtes en '''retirant un slash ( / ) qui trainait à la fin de l'url de ma requête'''.