web-dev-qa-db-fra.com

Axios - Aucun en-tête 'Access-Control-Allow-Origin' n'est présent

Il me manque quelque chose ici. J'avais du mal à faire en sorte que l'appel de l'API fonctionne . Ensuite, j'ai divisé l'URL comme ci-dessous et cela fonctionne littéralement une fois. Après cela, il ne fonctionne plus. Je jure que je n'ai pas changé quelque chose.

Comment vous y prenez-vous chez AXIOS?

Le message d'erreur est:

XMLHttpRequest ne peut pas charger http://magicseaweed.com/api/W2Z26fXscpELi7nPB0svfqcGj9FtGO9e/forecast/?spot_id=228 . Aucun en-tête 'Access-Control-Allow-Origin' n'est présent sur le .__ demandé. Ressource. Origin ' http: // localhost: 8080 ' n'est donc pas autorisé accès.

import axios from 'axios';

const ROOT_URL = `magicseaweed.com/api/W2Z26fXscpELi7nPB0svfqcGj9FtGO9e/forecast/`;

export const FETCH_WEATHER = 'FETCH_WEATHER';

export function fetchWeather() {
    const url = `http://${ROOT_URL}?spot_id=228`;
    const request = axios.get(url);

    return {
        type: FETCH_WEATHER,
        payload: request
    };
}

J'ai aussi essayé avec ce GET modifié, mais en vain

axios({
  url: url ,
  headers: {"Access-Control-Allow-Origin": "*"},
});
corsaxios
8
morne

Regardez ici:

https://www.npmjs.com/package/magicseaweed

Vers le bas, il est expliqué pourquoi leur wrapper d'API ne fonctionnera pas dans le navigateur. C'est la même raison pour laquelle vous ne pouvez pas effectuer l'appel Ajax dans le navigateur.

FAQ

Puis-je utiliser ce module dans le navigateur avec browserify?

En théorie, oui, mais l'API de Magicseaweed n'envoie actuellement pas l'en-tête Access-Control-Allow-Origin dans les demandes du navigateur (l'en-tête est envoyé si vous relisez la demande via cURL).

Donc, si l'API change ce comportement, ce module fonctionnera avec browserify. 

Vous pouvez configurer votre propre serveur proxy ou vous pouvez utiliser l'un des serveurs gratuits disponibles sur Internet:

https://developer.yahoo.com/yql/

https://crossorigin.me/

1
Robert Moskal