Estoy siguiendo un tutorial en udemy para hacer una aplicación meteorológica. Me quedé atascado en la lección 13. El código fuente se puede encontrar aquí: https://github.com/iamshaunjp/modern-javascript/blob/lesson-102/weather_app/scripts/forecast.js
Aquí está el curso: https://www.udemy.com/course/modern-javascript-from-novice-to-ninja/ (es un curso pago). Hay otros estudiantes que hacen la misma pregunta en el chat, pero no hay actualizaciones desde hace 2 años.
Recibo este mensaje de error:
127.0.0.1/:1 Acceso para buscar en > 'http://dataservice.accuweather.com/locations/v1/cities/search?> apikey= key_removed &q=manchester' from origin 'http://127.0.0.1:5500 ' ha sido bloqueado > por la política de CORS: la respuesta a la solicitud de verificación previa no pasa la verificación de control de acceso: no hay un encabezado 'Access-Control-Allow-Origin' en el recurso solicitado. Si una respuesta opaca satisface sus necesidades, establezca el modo de la solicitud en 'no-cors' para obtener el recurso con CORS deshabilitado.
Aquí está el código: clave const = ' removed_api_key ';
// get city information const getCity = async (city) => { const base = 'http://dataservice.accuweather.com/locations/v1/cities/search'; const query = `?apikey=${key}&q=${city}`; const response = await fetch(base + query, { mode: 'cors', headers: { 'Access-Control-Allow-Origin': 'http://127.0.0.1:5500', 'Content-Type': 'application/json', 'Access-Control-Allow-Headers': '*' } }); const data = await response.json(); return data[0]; }; getCity('manchester') .then(data => console.log(data)) .catch(err => console.log(err));
¿Cómo arreglar este problema? He agregado un modo y un encabezado que no están en el código original. Supongo que esto es algo que cambió en el navegador web después de que creó el curso. Intenté usar el modo: 'no-cors' y también configuré * en 'Access-Control-Allow-Origin' pero no tuve suerte para resolver este problema.