L'en-Tête de la SCRO "Access-Control-Allow-Origin' est manquant

Je suis en train d'utiliser webUntis'(docs) de l'API pour un projet d'école. Pour l'instant je suis juste essayer d'établir une connexion à l'API.

var result;
const url = 'https://api.webuntis.dk/api/status';
var xhr = new XMLHttpRequest();

xhr.open('GET',url, true);
xhr.setRequestHeader('Access-Control-Allow-Origin','*');
xhr.setRequestHeader('Content-type','application/json');
xhr.setRequestHeader('Access-Control-Allow-Methods','GET');
xhr.setRequestHeader('X-API-KEY', '/*API KEY*/');
xhr.send();


xhr.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
        result = xhr.responseType;
        console.log(result);
    }
};

Ce code génère le message d'erreur suivant:

De la croix-Origine de la demande bloqué: La même politique d'origine interdit l'
la lecture de la ressource externe à https://api.webuntis.dk/api/status
(Raison: SCRO-Tête "Access-Control-Allow-Origin' est manquant).

Comment peut résoudre ce problème? Peut-être que ma clé API est mal?

Avertissement: Le message d'erreur a été traduit de l'allemand.

  • Semble assez bien que vous n'êtes pas de demander votre propre serveur, au lieu de cela, directement à https://api.webuntis.dk/api/status vous devez créer un itinéraire, demander à votre serveur local et ensuite faire la demande de serveur à serveur
  • Tout d'abord, l'en-tête Access-Control-Allow-Origin devrait être sur le fichier d'en-tête, pas dans votre demande.
InformationsquelleAutor human being | 2017-10-17
  1. 9

    Vous présentez une demande à un autre site, dans ce cas, l'API à api.webuntis.dk. Ce type de demande est appelée une "Origine de la Croix-Demande"

    Pour ces demandes de travaux en JavaScript, le serveur sur leurs besoins pour leur permettre.

    C'est fait par de leur serveur d'envoi spécial de la SCRO en-têtes, le plus basique étant le "Access-Control-Allow-Origin" en-tête.

    Je suppose que l'API fournisseur n'a pas prévu ou planifié pour cette API pour être utilisé à partir d'une interface (par exemple JavaScript dans le navigateur), de sorte que vous avez à travailler autour de cela.

    Est une façon de mettre en place votre propre serveur et d'avoir le code JavaScript faites une demande à votre serveur et de votre serveur puis faire une requête à l'API, comme côté serveur code n'est pas lié à la SCRO-têtes.

    Sinon, pour essayer des choses, vous pouvez ajouter un préfixe de l'URL avec https://cors.io comme ceci: 

    const url = 'https://cors.io/?https://api.webuntis.dk/api/status';
    InformationsquelleAutor geekonaut
  2. 1

    Cela signifie essentiellement que cette API n'est pas configuré pour être appelée à partir d'une autre page web. La croix-Origine se réfère à faire une requête HTTP à partir d'un domaine (origine) à l'autre. Cette API est destinée à être utilisée à partir d'un serveur d'application. Si vous avez besoin de l'appeler à partir d'une page web, vous aurez besoin de créer un simple serveur proxy que votre page web peut appeler qui en feront la demande à webUntis.

    InformationsquelleAutor Bill
  3. 1

    Ce qui est de la SCRO ?

    de MDN :

    Cross-Origin Resource sharing (SCRO) est un mécanisme qui utilise
    supplémentaire en-têtes HTTP pour permettre à un utilisateur de l'agent d'obtenir la permission d'accéder à
    ressources sélectionnées à partir d'un serveur sur une origine différente (domaine) que
    le site est actuellement en cours d'utilisation. Un utilisateur agent met un cross-origin HTTP
    demande lorsqu'il demande une ressource à partir d'un domaine différent, le protocole, l'
    ou le port que celle à partir de laquelle le courant d'origine du document.

    SOLUTION

    Vous avez besoin de paramètres de la SCRO autorisation de votre serveur. (https://api.webuntis.dk/api/status)

    Paramètre Exemple :

    1. PHP

      <?php
      header("Access-Control-Allow-Origin: *");

    2. Rails

      #in config/application.rb
      config.action_dispatch.default_headers = {
      'Access-Control-Allow-Origin' => '*',
      'Access-Control-Request-Method' => %w{GET POST OPTIONS}.join(",")
      }

    remarque: le Changement de * à l'URL que vous souhaitez autoriser la SCRO. '*' est fortement déconseillée, à moins que vous êtes fournissant une API publique qui est destiné à être consulté par tous les consommateurs là-bas.

    InformationsquelleAutor Adrian Rotama
  4. 0

    Envoi Access-Control-Allow-Origin pour le serveur résout rien. Le serveur doit envoyer Access-Control-Allow-Origin défini * de votre navigateur pour autoriser les requêtes ajax pour exécuter.

    InformationsquelleAutor Paun Narcis Iulian