Message d'erreur access to fetch

**cdevl37** · 05/04/2020, 15h01

Bonjour,

Je reçois ce message d'erreur avez vous une idée ?

Access to fetch at 'http://freegeoip.net/json/87.65.12.100' from origin 'http://weather' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
app.js:12 GET http://freegeoip.net/json/87.65.12.100 net::ERR_FAILED
main @ app.js:12
async function (async)
main @ app.js:10
(anonymous) @ app.js:33
app.js:22 Uncaught (in promise) TypeError: Failed to fetch

mon code source index.html :

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
<!DOCTYPE html>
    <html lang="en">
        <head>
            <meta charset="UTF-8">
            <title>La météo chez vous !</title>
            <link rel="stylesheet" href="app.css">
            <link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/weather-icons/2.0.10/css/weather-icons.min.css">
        </head>
        <body>
 
            <section id="app">
                <h1>
                    <span id="ville">Marseille</span>
                    <span class="tooltip">Tapez une autre ville si vous le souhaitez</span>
                </h1>
                <i class="wi wi-day-rain"></i>
                <h2>
                    <span id="temperature">25</span> C° (<span id="conditions">Ciel dégagé</span>)
                </h2>
            </section>
            <script src="app.js"></script>
        </body>
    </html>

mon fichier app.js

Code :

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
 
 
function capitalize(str){
    return str[0].toUpperCase() + str.slice(1);
}
 
async function main(){
    const ip = await fetch('https://api.ipify.org?format=json')
        .then(resultat => resultat.json())
        .then(json => json.ip);
 
            const ville = await fetch('http://freegeoip.net/json/' + ip)
                .then(resultat => resultat.json())
                .then(json => json.city);
 
                    const meteo = await fetch('http://api.openweathermap.org/data/2.5/weather?q=${ville}&appid=58b98cab72465e9c2fb8a950623b8f03&lang=fr&units=metric')
                    .then(resultat => resultat.json())
                    .then(json => json)
 
                    // afficher les inofrmations sur la page
                    displayWeatherInfos(meteo)             
                }
 
                function displayWeatherInfos(data) {
                  const name = data.name;
                  const temperature = data.main.temp;
                  const conditions = data.weather[0].main;
                  const description = data.weather[0].description;
 
                  document.querySelector('#ville').textContent = name;
                  document.querySelector('#temperature').textContent = Math.round(temperature);
                  document.querySelector('#conditions').textContent = capitalize(description);
                }
 
    main();

**Watilin** · 05/04/2020, 22h45

Bonsoir,
je crois que l’API n’existe plus. Je viens de saisir l’adresse http://freegeoip.net/json/87.65.12.100 dans ma barre d’adresse et j’ai été redirigé (code 301) vers l’URL http://freegeoip.net/shutdown qui est une page HTML contenant un script faisant encore une autre redirection. Ça n’a aucune chance de fonctionner avec une requête demandant du JSON, et de plus, ça n’envoie pas les bons en-têtes pour que CORS fonctionne.

Je n’ai pas de solution à ton problème, sinon de te conseiller de trouver un autre service :/
En attendant, voici un guide sur qu’est-ce-que c’est quoi donc CORS : https://developer.mozilla.org/fr/docs/Web/HTTP/CORS

**cdevl37** · 05/04/2020, 22h58

merci à vous

Message d'erreur access to fetch

jQuery

Discussions similaires

Partager

Partager