The local weather app

Hi guys!!
I have some issues with this project I try to get the weather according to the location but It failed.
And I received this: Failed to load resource: the server responded with a status of 401 (Unauthorized).

I need help :triumph: :sob:
Thank you for your understanding :blush:

function getLocation() {
	if(navigator.geolocation) {
		navigator.geolocation.getCurrent(showWeather);  

	} else {
		town.innerHTML("Geolocation is not supported by this browser.");
	}
}

function positionPo(position) {
	var pos = position.coords;
	console.log("longitude:  " + pos.longitude + "latitude:  " + pos.latitude);
}

function error(err) {
  console.warn(`ERROR(err.code): err.message`);
}
navigator.geolocation.getCurrentPosition(positionPo, error);

const cityField = document.querySelector('#city');
const tempField = document.querySelector('#temp');
const weatherField = document.querySelector("#weather");

const showWeather = () => {
    const townQuery = cityField.value;
    const tempQuery = tempField.value;
    const weatherQuery =  weatherField.value;
    const endpoint = `${url}${APPID}${townQuery}${id}`;

    const xhr = new XMLHttpRequest();
    xhr.responseType = 'json';

    xhr.onreadystatechange = () => {
    	if(xhr.readyState === XMLHttpRequest.DONE) {
    		renderResponse(xhr.response);
    	}
    }

    xhr.open('GET', endpoint);
    xhr.send();
}

showWeather();


401 means they donโ€™t like your credentials. Make sure youโ€™re sending your API key along with any client secrets.

1 Like

Make sure youโ€™re connecting to codepen via https://.