CORS html/javascript

**mathias39** · 27/07/2020, 15h01

Bonjour,
J'aimerais, depuis une page html pouvoir effectuer une requ�te http vers un syst�me se trouvant dans mon r�seau. Pour cela j'utilise javascript et XMLHttpRequest.
Voici mon code :

Code HTML :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/html" xmlns="http://www.w3.org/1999/html">
<head>
    <meta charset="UTF-8">
    <title>data</title>
</head>
 
<body>
<button onclick="blabla()">getSipStatus</button>
</body>
 
<script type="text/javascript">
    function blabla(){
        var xhr = new XMLHttpRequest();
        return new Promise(function(resolve, reject) {
            xhr.onreadystatechange = function() {
                if (xhr.readyState == 4) {
                    if (xhr.status >= 300) {
                        reject("Error, status code = " + xhr.status)
                    } else {
                        resolve(xhr.responseText);
                        console.log(xhr.responseText)
                    }
                }
            }
            url="http://192.168.10.102/bha-api/sip.cgi?action=status"
            xhr.open('get', url, true)
            xhr.setRequestHeader("Access-Control-Allow-Origin","http://localhost:3000")
            xhr.setRequestHeader('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE');
            xhr.setRequestHeader('Access-Control-Allow-Headers', 'Content-Type');
            xhr.send();
        });
    }
</script>
 
</html>

Et voici l'erreur que j'obtient lorsque je charge cette page dans chrome ou firefox :

Access to XMLHttpRequest at 'http://192.168.10.102/bha-api/sip.cgi?action=status' from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

**SpaceFrog** · 27/07/2020, 15h10

Il s'agit d'une s�curit�, tu ne peux pas faire uen requ�te ajax sur un autre domaine sans autorisation:

fais une petit recherche avec

Access-Control-Allow-Origin:

Tu arriveras sur des liens de ce type
https://developer.mozilla.org/fr/doc...OriginManquant

**mathias39** · 27/07/2020, 15h40

J'ai d�j� regard� sur les forums etc mais aucunes solutions propos�es ne fonctionne pour moi. J'ai ajout� les bonne autorisations dans le header mais aucun r�sultat ...

**mathias39** · 27/07/2020, 15h44

Si je tape l'url : http://192.168.10.102/bha-api/sip.cgi?action=status dans mon navigateur j'obtient un Json. L'adresse 192.168.10.102 est pr�sente dans mon r�seau local et je ne peux pas du tout modifier la configuration de cette machine afin d'ajout� certaines autorisations.
J'aimerais juste depuis une page html r�cup�rer le json renvoy� par cette adresse.

**Doksuri** · 27/07/2020, 15h55

Envoy� par mathias39

Si je tape l'url : http://192.168.10.102/bha-api/sip.cgi?action=status dans mon navigateur j'obtient un Json

c'est normal... tu ne requetes pas l'url depuis un autre domaine...
comme l'a precise SpaceFrog, c'est par securite que les ajax cross-domain ne sont pas autorises. il faut que dans la conf de ton serveur tu autorise un (ou tous) autre domaine a acceder a ton serveur

**mathias39** · 27/07/2020, 16h02

Mais je ne peux pas acc�der du tout � la configuration du serveur se trouvant sur l'adresse ip cible de ma requ�te

**SpaceFrog** · 27/07/2020, 16h04

Alors tu ne pourras pas faire un ajax�

**mathias39** · 27/07/2020, 16h19

Existe-t'il d'autre moyen de r�cup�rer le json renvoy� par cette url ?

**FlorentA** · 27/07/2020, 16h22

Bonjour.

Je suis tomb� sur la m�me erreur aujourd'hui en cherchant � utiliser EventSource. L'une des tr�s rares pages qui en parlent (tr�s succinctement�) est celle de Mozilla �voqu�e plus haut.

J'ai donc mis un .htaccess sur mon site avec la ligne

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

Header set Access-Control-Allow-Origin mon-domaine

avec ou sans apostrophe autour du domaine (c'est mis dans ces pages� sans exemple) et j'ai toujours un avertissement CORS qui change de message ; il me dit que

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

Access-Control-Allow-Origin=mon-domaine

ne correspond pas dans le header �

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

Access-Control-Allow-Origin=mon-domaine

!

Du coup, j'ai test� la version nginx vu qu'entre temps j'ai remarqu� que mon serveur �tait nginx�

�a ne lui a pas plus du tout !

Donc, pour enrichir l'aide et la documentation sur cette configuration et avoir un exemple concret sur le net, que faut-il mettre pr�cis�ment et o� ?

Merci.

**SpaceFrog** · 27/07/2020, 16h22

cot� serveur avec un curl ?

**mathias39** · 27/07/2020, 16h39

Oui mais c�t� serveur l'adresse 192.168.10.xxx n'est pas atteignable car elle est dans le r�seau local du client ...

**SpaceFrog** · 27/07/2020, 17h25

a part d�poser le fichier ou une copie dans un endroit accessible, DMZ � ou faire un web service dans un endroit accessible qui ira chercher les donn�es ...

**NoSmoking** · 27/07/2020, 17h42

Bonjour,
j'ai du mal � comprendre l'architecture:

pouvoir effectuer une requ�te http vers un syst�me se trouvant dans mon r�seau.

L'adresse 192.168.10.102 est pr�sente dans mon r�seau local

je ne peux pas acc�der du tout � la configuration du serveur se trouvant sur l'adresse ip cible de ma requ�te

l'adresse 192.168.10.xxx n'est pas atteignable car elle est dans le r�seau local du client ...

**Lunesti** · 15/08/2020, 12h21

Bonjour, je rencontre le m�me probl�me , depuis ce matin je n'arrive pas � r�cup�rer les donn�es depuis l'API jcdecaux. j'ai ce message d'erreur :

"Access to XMLHttpRequest at 'https://api.jcdecaux.com/vls/v1/stations?contract=amiens&apiKey=86e2bc05a438193dfbc09fcaa44634b7c6641d2c' (redirected from 'http://api.jcdecaux.com/vls/v1/stations?contract=amiens&apiKey=86e2bc05a438193dfbc09fcaa44634b7c6641d2c') from origin 'http://localhost:52330' has been blocked by CORS policy: The 'Access-Control-Allow-Origin' header has a value 'http://localhost:52330' that is not equal to the supplied origin."

A savoir que jusqu'� pr�sent tout fonctionnait correctement car j'avais install� l'extension. J'ai tout essay� (navigation priv�e, vider le cache, changer de navigateur, etc...)

Je ne sais plus comment faire quelqu'un a d�j� rencontr� ce probl�me et l'a arrang� ?

**Loralina** · 16/08/2020, 22h33

Bonjour,
Difficile � dire comme �a.
Access-Control-Allow-Origin est une ent�te qui vient du serveur auquel s'adresse XMLHttpRequest.
Apparemment, la valeur est la m�me que l'origine envoy�e, donc en principe ce devrait �tre bon...

D'apr�s mes tests, je pense que le probl�me vient de votre configuration, il reste � savoir o� (httpd.conf, htaccess, js ?)

A tester :
Cr�er un fichier test.html et dans des balises <script></script>, y mettre l'exemple ici (en rempla�ant l'url).
Ensuite, tester ce fichier de ces deux mani�res :
- Via le serveur local : localhost:52330/test.html
- Via le protocole file en ouvrant directement le fichier avec un navigateur.

Dans la console, il faut certes regarder la r�ponse, mais aussi les ent�tes de la requ�te et de la r�ponse (qu'on peut voir aussi dans l'onglet r�seau).

**Lunesti** · 17/08/2020, 10h03

J'ai trouv� la solution i�i :

https://medium.com/@dtkatz/3-ways-to...ks-d97d55946d9

Il suffit d'ajouter cet URL juste avant de d�clarer votre API : https://cors-anywhere.herokuapp.com/

par exemple :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
        this.ajaxGet('https://cors-anywhere.herokuapp.com/http://api.jcdecaux.com/vls/v1/stations?contract=amiens&apiKey=86e2bc05a438193dfbc09fcaa44634b7c6641d2c', (reponse) => {
//CODE
}

**Loralina** · 17/08/2020, 12h08

Bonjour,

Envoy� par Lunesti

J'ai trouv� la solution i�i :

Disons que c'est une solution qui d�panne (et c'est bien de l'avoir trouv�e ! et aussi de la communiquer !

).

Id�alement/ult�rieurement, il serait bien d'analyser ce qui coince de votre c�t� dans le cas d'un acc�s direct.

**Lunesti** · 17/08/2020, 14h16

Oui, ce qui est s�r c'est que cela ne peut pas venir de mon code car cela fonctionnait, et du jour au lendemain �a n'a plus fonctionn�. N'ayant rien modifi� au pr�alable qui aurait pu causer ce dysfonctionnement je ne peux qu'en d�duire que cela provient de mon h�bergeur OVH mais �a reste � confirmer

CORS html/javascript

JavaScript

Discussions similaires

Partager

Partager