Pourquoi est-ce que je reçois une erreur « No 'Access-Control-Allow-Origin' Header » lors de l'accès à une API REST ?

Aucun en-tête « Access-Control-Allow-Origin » en réponse

Comprendre CORS et les requêtes contrôlées en amont

Partage de ressources entre origines croisées (CORS) est un mécanisme qui permet aux requêtes du navigateur d'accéder à des ressources provenant d'origines différentes de l'origine requérante. Lorsqu'une requête est effectuée depuis une origine différente, le navigateur envoie une requête de contrôle en amont OPTIONS au serveur pour vérifier si le serveur autorise la requête.

Dans le cas décrit dans la question, le navigateur envoie une requête de contrôle en amont OPTIONS demande à l'API HP ALM REST. Cependant, le serveur ne répond pas avec les en-têtes CORS nécessaires, provoquant l'erreur « Aucun en-tête 'Access-Control-Allow-Origin' n'est présent sur la ressource demandée. »

Résoudre le problème

Il existe plusieurs façons de résoudre ce problème :

Utiliser un CORS Proxy :

Un proxy CORS transmet la requête au serveur de destination et ajoute les en-têtes CORS nécessaires à la réponse. Cela peut être pratique si vous n'avez pas de contrôle sur le serveur de destination.

Éviter les demandes de contrôle en amont :

Pour éviter la demande de contrôle en amont, vous pouvez vous assurer que la demande ne nécessite pas d'en-têtes Authorization ou Content-Type. Ceci peut être réalisé en utilisant des méthodes d'authentification alternatives ou en encodant les données JSON en tant que paramètre de requête.

Résolution du problème des caractères génériques :

L'erreur « Access-Control-Allow -L'en-tête d'origine ne doit pas être le caractère générique" se produit lorsque le serveur spécifie un caractère générique ("*") pour l'en-tête Access-Control-Allow-Origin au lieu de l'origine spécifique du client demandeur. Pour résoudre ce problème, configurez le serveur pour définir l'en-tête Access-Control-Allow-Origin sur l'origine requérante.

Correction du code JavaScript

Le code JavaScript dans la question comporte des en-têtes incorrects qui déclenchent la demande de contrôle en amont :

headers.append('Access-Control-Allow-Origin', 'http://localhost:3000');
headers.append('Access-Control-Allow-Credentials', 'true');

Supprimez ces en-têtes car ils ne doivent pas être envoyés dans la demande.

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!