Estoy teniendo un problema con una petición AJAX desde el navegador Chrome el cual no me había pasado nunca. Estoy requiriendo datos de la API de Dark Sky y me aparece este mensaje:
Utilizo NodeJS con express
localhost/:1 XMLHttpRequest cannot load https://api.darksky.net/forecast/bcce7da12ae098129b6c69b207e89ecb/28.1235459,-15.4362574. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3030' is therefore not allowed access.
- Ya he utilizado las flags --disable-web-security --user-data-dir
- He usado el proxy CORS de crossoriginme.com
- He customizado el header en la peticion AJAX que hize con jQuery
- En codepen.io me funciona perfectamente y puedo comunicarme sin problemas
Y nada, que no me quiere entregar los datos, aquí debajo pongo el código:
**Configuración express: **
const express = require('express')
const app = express();
let port = process.env.PORT || 3030;
app.set('view engine', 'jade');
app.use(express.static(__dirname + '/public'))
app.use(function(req, res, next) {
res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
next()
})
app.get('/', (request, response) => {
response.render('index')
})
app.listen(port, () => {
console.log(`Server listening on port ${port}`)
})
Archivo JS
import $ from 'jquery';
function getLocation() {
if ("geolocation" in navigator) {
navigator.geolocation.getCurrentPosition(function(position) {
fetchWeatherData(position.coords.latitude, position.coords.longitude)
}, function(error) {
//Aqui manejo los errores
})
} else {
//Pendiente aun
}
}
function fetchWeatherData(latitude, longitude) {
let URL = `https://api.darksky.net/forecast/bcce7da12ae098129b6c69b207e89ecb/${latitude},${longitude}`
$.ajax(URL, {
method: 'GET',
dataType: 'json',
beforeSend: function(request) {
request.setRequestHeader("Access-Control-Allow-Origin", '*');
},
success: function(response) {
console.log(response.data)
}
})
}
getLocation()
Uso gulp + browserify + babelify para hacer el bundle