Hola tengo problemas con este código, en versiones de jquery si me hace la petición con cors, pero con fetch solo algunos funcionan y en ...

Pregunta de la clase:
Haciendo múltiples requests
Alejandro González Reyes

Alejandro González Reyes

Pregunta
studenthace 6 años

Hola tengo problemas con este código, en versiones de jquery si me hace la petición con cors, pero con fetch solo algunos funcionan y en otros me manda dicha restricción CORS

funciona excelente

const API_URL = 'https://swapi.co/api/' const PEOPLE_URL = 'people/:id' const options = { crossDomain: true, dataType: 'jsonp' } $.support.cors = true; var onResponse = function(data) { console.log(`Hola, yo soy ${data.name}`); } var obtenerPersonaje = function(id) { const URL = `${API_URL}${PEOPLE_URL.replace(':id', id)}` $.get(URL, options, onResponse) } for(var i = 1; i < 16; i++) { obtenerPersonaje(i) }

Funciona con algunos, por ejemplo 2 y 4 me manda error CORS

const API_URL = 'https://swapi.co/api/' const PEOPLE_URL = 'people/:id' const boton = document.getElementById('buscar') const resultado = document.getElementById('resumen') boton.addEventListener('click', function(e) { e.preventDefault() const personaje = document.getElementById('personaje').value // Reemplazar el marcador de posicion :id por el número de personaje seleccionado por el usuario const URL = `${API_URL}${PEOPLE_URL.replace(':id', personaje)}` // Peticiones a URL diferentes de nuestro sitio, es importante activar CROSS DOMIN (Intercambio de recursos de origen cruzado) const opciones = { mode: 'cors' } // Este es mi función de callback, recibe la data del servidor var onResponse = function(data) { console.log(arguments) resultado.innerHTML = `El personaje seleccionado es ${data.name}` } // 1. Realizar la petición al servidor (API DE STARWARS) fetch(URL, opciones).then(function(response) { // En ocasiones desconocemos cuantos argumentos recibe una función, para ello existe arguments. Que es un arreglo que nos indica el orden de los argumentos. Para este caso el primer parametro es la data que responde el servidor (response) console.warn(arguments) // Fetch funciona en dos pasos, primero recibe la cabecera de respuesta, es necesario retornarla en formato json return response.json() // La respuesta con la data se recibe en la segunda promesa, LA CUAL RECIBE UN CALLBACK, Y ESTE SE EJECUTA CUANDO LA PROMESA SE SATISFACE }).then(onResponse) })
1 respuestas
para escribir tu comentario
    Daniel Adolfo Ordoñez Rubio

    Daniel Adolfo Ordoñez Rubio

    studenthace 5 años

    Hola, Alejandro Probé tu código y creo que el problema real es la URL del API, cambia

    swapi.co/api/
    por
    swapi.dev/api/

    :D cuéntame si pudiste resolverlo

Fundamentos de JavaScript 2018

Fundamentos de JavaScript 2018

JavaScript es un lenguaje de programación que se trabaja desde el navegador. Construye programas, conoce el entorno, los condicionales y las estructuras repetitivas. Aprende cuáles son y cómo se declaran las variables y las funciones de JS.

Fundamentos de JavaScript 2018
Fundamentos de JavaScript 2018

Fundamentos de JavaScript 2018

JavaScript es un lenguaje de programación que se trabaja desde el navegador. Construye programas, conoce el entorno, los condicionales y las estructuras repetitivas. Aprende cuáles son y cómo se declaran las variables y las funciones de JS.