Erreur CORS lors de l'appel axios.get

Je suis à l'aide d'axios de faire un axios.obtenez de l'appel dans mon redux action.js fichier.
Dans mon composant cette action est effectuée sur le formulaire de soumission.

J'obtiens le statut de 200 dans ma console mais n'obtenant aucune réponse en retour.
J'obtiens l'erreur suivante:

No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http:\\\\localhost:3000' is therefore not allowed access.

Quelqu'un est venu à travers une telle erreur? Voulez-vous s'il vous plaît partager sur la façon de résoudre ce problème.

source d'informationauteur user4076248

  1. 14

    Le problème n'est pas avec de l'axios. Le problème est avec le serveur. Lorsque vous servez des données, vous devez ajouter les en-têtes suivants, avant de l'envoyer.

    Access-Control-Allow-Origin
    doit être mis à
    *

    Access-Control-Allow-En-Têtes De
    doit être mis à
    Origine, X-Requested-With, Content-Type, Accepter

  2. 12

    La première confusion, j'ai eu ce problème a été de comprendre ce qu'est un contrôle en amont de la demande de moyens. Donc, je vais commencer à partir de là.

    Navigateurs envoyer de contrôle en amont des demandes à chaque fois qu'une demande ne remplit pas ces critères:

    1. HTTP méthodes correspond à l'une des (sensible à la casse):
      • OBTENIR
      • POST
      • TÊTE
    2. En-Têtes HTTP matches (insensible à la casse):
      • Accepter
      • Accepter La Langue
      • Langue Du Contenu
      • Dernier-Event-ID
      • Type de contenu, mais seulement si la valeur est l'un des:
        • application/x-www-form-urlencoded
        • multipart/form-data
        • text/plain

    De contrôle en amont des demandes sont faites avec une méthode des OPTIONS qui comprend trois en-têtes supplémentaires que votre serveur ne peut pas s'attendre si elle n'est pas configuré pour la SCRO. Ils sont:

    • Access-Control-Allow-En-Têtes De
    • Access-Control-Allow-Origin
    • Access-Control-Allow-Méthodes

    Si le serveur n'est pas configuré pour les CORS, il a tout simplement répondu avec un vide-tête ayant le code de statut HTTP 200. Une fois que vous avez configuré le serveur pour la SCRO, vous devez inclure les en-têtes ci-dessus comme en-têtes soutenue par la SCRO.

    Qui devrait effacer l'erreur et vous permettent de communiquer avec le serveur.

    Remarque: Pendant que votre serveur peut gérer l'en-tête personnalisé que vous avez créé (dans mon cas, Authorization pour JWT d'authentification), il est probable qu'il ne sera pas configuré pour la SCRO demande. Si vous avez accès à votre serveur, il suffit de trouver comment configurer la SCRO pour ce serveur.

    Pour plus d'informations à propos de la SCRO. Voir https://www.html5rocks.com/en/tutorials/cors/