web-dev-qa-db-fra.com

JavaScript - XMLHttpRequest, erreurs Access-Control-Allow-Origin

J'essaie d'envoyer un XMLHttpRequest à un site de collage. J'envoie un objet contenant tous les champs requis par l'API, mais je continue à avoir ce problème. J'ai lu le numéro et j'ai pensé:

httpReq.setRequestHeader('Access-Control-Allow-Headers', '*');

Cela réglerait le problème, mais ce n’était Quelqu'un at-il des informations sur cette erreur et/ou comment je peux le réparer?

Voici mon code:

(function () {

    'use strict';

    var httpReq = new XMLHttpRequest();
    var url = 'http://paste.ee/api';
    var fields = 'key=public&description=test&paste=this is a test paste&format=JSON';
    var fields2 = {key: 'public', description: 'test', paste: 'this is a test paste', format: 'JSON'};

    httpReq.open('POST', url, true);
    console.log('good');

    httpReq.setRequestHeader('Access-Control-Allow-Headers', '*');
    httpReq.setRequestHeader('Content-type', 'application/ecmascript');
    httpReq.setRequestHeader('Access-Control-Allow-Origin', '*');
    console.log('ok');

    httpReq.onreadystatechange = function () {
        console.log('test');
        if (httpReq.readyState === 4 && httpReq.status === 'success') {
            console.log('test');
            alert(httpReq.responseText);
        }
    };

    httpReq.send(fields2);

}());

Et voici la sortie exacte de la console:

good
ok
Failed to load resource: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://127.0.0.1:40217' is therefore not allowed access. http://paste.ee/api
XMLHttpRequest cannot load http://paste.ee/api. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://127.0.0.1:40217' is therefore not allowed access. index.html:1
test

Voici la sortie de la console lorsque je la teste localement sur un navigateur Chromium standard:

good
ok
XMLHttpRequest cannot load http://paste.ee/api. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. index.html:1
test
javascriptxmlhttprequest
19
Nik

Je pense que vous avez manqué le point de contrôle d'accès.

Une brève récapitulation des raisons pour lesquelles CORS existe: Etant donné que le code JS d’un site Web peut exécuter XHR, ce site peut potentiellement envoyer des demandes à autres sites, se faisant passer pour vous et exploitant l’approbation ces sites = avoir en vous (par exemple, si vous vous êtes connecté, un site malveillant pourrait tenter d'extraire des informations ou d'exécuter des actions que vous n'avez jamais souhaitées) - c'est ce que l'on appelle une attaque CSRF. Pour éviter cela, les navigateurs Web ont des limites très strictes sur ce que vous pouvez envoyer avec XHR - vous êtes généralement limité à votre domaine, et ainsi de suite.

Désormais, il est parfois utile qu'un site permette à d'autres sites de le contacter. Les sites qui fournissent des API ou des services, comme celui auquel vous essayez d'accéder, seraient les meilleurs candidats. CORS a été développé pour permettre au site A (par exemple, paste.ee) pour dire "Je fais confiance au site B, vous pourrez donc m'envoyer XHR". Ceci est spécifié par le site A qui envoie les en-têtes "Access-Control-Allow-Origin" dans ses réponses.

Dans votre cas particulier, il semble que paste.ee ne se donne pas la peine d’utiliser CORS. Votre meilleur choix est de contacter le propriétaire du site et de savoir pourquoi, si vous souhaitez utiliser paste.ee avec un script de navigateur. Vous pouvez également essayer d’utiliser une extension (celles-ci devraient avoir des privilèges XHR plus élevés).

41
Sacho

J'ai eu le même problème. Les journaux de serveurs ont montré:

DEBUG: <-- Origin: null

J'ai enquêté sur cela et il s'est avéré que ce n'est pas rempli quand j'ai appelé à partir d'un fichier à partir du lecteur local. Lorsque j'ai copié le fichier sur le serveur et que je l'ai utilisé depuis le serveur, la requête a parfaitement fonctionné

0
Konki