Fetch API in JavaScript (GET, POST, PUT, DELETE) | asynchronous programming
HTML-код
- Опубликовано: 29 авг 2019
- With Fetch you can ask for external resources like text, images, JSON, etc from your server or external servers to what we know as APIs, no more ajax, live fetch.🎉
Subscribe for more content about JavaScript.
Follow me to see behind scenes and exclusive content.👇🏼
/ leonidasesteban
/ leonidasesteban
github.com/leonidasesteban
Documentation of Fetch:
developer.mozilla.org/es/docs... 
Наука
Clase de promesas 👉 ruclips.net/video/EVQR8TjjAWA/видео.html
El mejor... Gracias
Muchas gracias crack!
Leonidas gracias por dejar contenido como este, estoy realizando un sitio web que permite en un input dejar un excel este se convierte a json y después me debo enviar esta información a traéz de un API REST que exije parametros de encabezado y además con un secret id debo generar un token válido para realizar la petición a la API externa te agradecería si algún día realizas un video con este tipo de peticiones que la verdad no se ven fácilmente en contenido de youtube muchas gracias y bendiciones.
Los archivos de la clase donde estan?
Este vídeo me hubiera ahorrado mucha investigación y prueba - error hace 3 días 😅😅 P.S.: Me gustaría que hicieras la clase de promesas.
Promesas y luego Async Await
me ha servido mucho tu explicación. muchas gracias Leonidas...
no te imaginas como me han ayudado tus videos muchas gracias.
¡Super vídeo, gracias Leonidas!
Sos un genio !!! hice cursos tuyos en varias plataformas y no tienen desperdicio !!! una genialidad !!!
el mejor tutorial condensado de fetch, muchas gracias
Genial tus vídeos , Pikachu quedó loco con la teletransportación. 😂👍👍.
Sigue adelante y éxitos.
Me encantó muchísimo, Gracias !!!
Profe Leónidas, quedo muy claro y me ayudo muchísimo. Espero que este fin de semana disfrute de un riquísimo ceviche.
Gracias por tu clase.
Gracias Leonidas! Eres un máster! 🔥🔥🔥
Leonidas, te sigo desde hace años, la verdad ya se que sos groso y que te encanta estas cosas, pero ahora descubro que sos muy bueno explicando, por eso, por mas que sepa del tema, veo tus videos,.
Muuuy bueno y te felicito!!.
Saludos,.
Una maravilla como explicas Leonidas, felicidades y muchas gracias me super sirvio!! :)
Genial gracias Leónidas esto me ha servido mucho y porfin me quedo claro
Hey! Leonidas que bueno tenerte por acá exitos en tu canal (apenas te descubrí)
Excelente explicación 👍
Salu2 desde Colombia
Hola Jeff, hay un montón de contenido ya espero te sirva para entender mejor javascript 🤘 suscríbete y ponle campanita que todas las semanas habrá algo nuevo
Que buen video excelente como lo explicas
Hola Leónidas, sabes como puedo actualizar un archivo .Json desde un archivo .js ? La clase está muy bien, con mucha información útil y graaaacias peeeeero... solo has puesto ejemplos de ✅GET, los métodos❌POST, 💥PUT, 💥DELETE sólo los has enumerado. Por favor, haz honor al título del video y pon un ejemplo de cada. Sobre todo de 💥PUT💥ya que PUT y DELETE me fallan con Live Server y XAMPP y no se qué hacer, se ve que es un problema muy típico, ya que los servidores inhabilitan PUT y DELETE.
Leónidas en serio eres muy gracioso y practico, una manera de aprender buenísima
Gracias Alejandro, me caen mejor los que les gustan mis chistes no tan chistosos 😅
@@LeonidasEsteban son buenísimos !!!
Muchas gracias por la explicación!
Seria bueno que un próximo video hagas un pequeño CRUD con un input y un botón que haga todos los métodos, GET, POST, PUT, DELETE con Fetch o async await.
total
que vengan las clases de Promesas !!!! Graciiass por toodoooo
Excelente clase, muchas gracias
Llevaba aproximadamente una semana intentando conseguir que el JSON funcionará y con esto lo pude hacer funcionar, muchas gracias
Lo haces ver tan sencillo muchas gracias te diré profe, jeje gracias profe espero más vídeos así, me estoy motivando a aprender más Javascript un abrazo profe saludos
😅 con mucha práctica se pone más fácil, dedícale tiempo todos los días para que poco a poco vayas mejorando.
muy buen video
y sobre todo el carisma
Muchas gracias 🙏 me divierto mucho haciendo esto
men muy buena tu intención de enseñar me parece genial
Grande profe, saludos desde Chile ✊🏽
Saludos hasta chile 🌶 🇨🇱
Excelente muchas gracias!!
justo lo que necesitaba
Yeiiii, compártelo, seguro alguien más lo necesita
gracias! muy bueno, claro y práctico. saludos. -
Llevaba como 5 Días intentando manipular la respuesta de la petición y Leónidas me lo explico en el min 10 solo ejecutar función y le pasó la data como parametro muchas gracias
.then((response) => {
const image = response.url // acá ya guardas la url de la imagen
renderImage(image)
})
Leónidas lo probé asi y me funcionó, gracias por este video, siempre tanta informacion de calidad!!
Excelente clase, pasare mas seguido a ver los vídeos, desconocía lo de pasar un objeto de tipo blob convertirlo a string y mostrarlo como URL eso fue puff.
Excelente Leonidas!
lo maximo, un saludo
Buen video, leo gracias, me gustaría la clase de promesas y también de subir imágenes al servidor con Fetch API.
muy bien explicado, me ayudo
Maravilloso! Esto es súper indispensable en el día a día
No me sabía lo del debugger, siempre ponía puntos de interrupción, gracias!
Súper 👏 comparte al clase para que más gente se entere
Vanilla Javascript💪🏼
Estoy aprendiendo mucho con la #escuelajs y con estos videos
me encanta la API de pokemón :D gracias! muy entretenido!
Es mi favorita
Gracias por la explicación, muy divertida y me encanta ver la pokeApi. Saludos.
Muchas gracias :)
Muy buena clase, me gustaría ver la clase de promesas :D
te prometo una clase de promesas
@@LeonidasEsteban estaré al pendiente de tu canal 🤩
Excelente clase.. con razón yo sufría con el objeto XMLHttpRequest
Aquí no lo discriminamos ruclips.net/video/4l0PELZZqAM/видео.html
Oye @@LeonidasEsteban de casualidad no tienes un vídeo sobre el protocolo HTTP. Y como funciona, es que por más que leo y busco, no logro entender cómo funciona como tal, es decir cómo van los datos y demas.... Ah por cierto gracias por todos este contenido
De grande quiero ser como Leonidas
Eres un genio
🤘🏽
Vengo de la carrera de JS en Platzi y gracias a esto me ahorré bastantes dolores de cabeza :D
😎 que buen feedback
Es man se me hacia conocido, cuando dijo pokemon me acorde que vi ele curso de git y github de paltzi con el. muy bien profesor
Always Pro, never no pro. :)
Excelente vídeo
Gracias por este aporte Leonidas, siempre se aprende algo nuevo. Estaria muy interesante una comparacion de Fetch vs Ajax.
Tenemos una clase de ajax en el canal, obvio de por Fetch
genial, Profesional
grande!!
Muy buen vídeo!!! Tienes ejemplos de fetch con otros métodos?
Gracias, eres muy bueno!!!!
si my chevre esta clase...POR FAVOR LEONIDAS...CURSO DE REACT NATIVE
Poco a poco, por lo pronto mi curso de React Native está en platzi.com/native
Haz la clase del form data que mencionas
excelente video, si puedes hacer un video de postman seria bueno
Buen video
Muchas gracias :)
Que buena información para mí en este momento jaja , una pregunta, si ya tengo una API y quiero imprimir ese JSON en formato CSV puedo darle el formato de mi archivo model en algún punto, o me toca formatear el csv antes de obtenerlo?
Excelente, gracias Leonidas.
Creo que como parte complementaria también podrías explicar un poquito acerca de los catch. Pero estuvo genial tu explicación.
Y sí, una clase de promesas por favor.
Saludos de Perú
ruclips.net/video/EVQR8TjjAWA/видео.html
No dije nada v:
Saludos.
Que cool que estes explorando las clases que tenemos disponibles 😊 ponle campanita al canal para que asistas a la sesiones en vivo. Se pone muy divertido.
Si queremos ver la clase promesas porfavor leo 💪🏼
No se diga más
¿al usar fetch puedo "cachear" el error usando catch al finalizar la promesa y pasarlos como argumento cuando defino la promesa (return new Promise(response, reject))?
Muy bueno el video.
Tengo un problema al referenciar métodos de un webComponent desde un fetch. Muchas gracias
Eres un master, tan facil que lo explicas todo jajajaja
Muy buena clase, pero se puede agregar un preload a un fetch? Cuando por ejemplo estas trayendo muchas imagenes y se demora en cargar, se podrìa mostrar una imagen de espere por favor o algo similar?
Esto me hubiese facilitado la vida en el segundo proyecto del bootcamp xD
Sería genial una clase de promesas, async/await y una sobre el uso del debugger y console.
¡Gracias! :)
De acuerdo
Esto es el santo grial del desarrollo frontend
buen video , solo que me hubiera gustado ver ademas la forma de manejar los errores tipo conexion.
Estoy queriendo hacer un CRUD pero no que usar... pienso usar Ajax, pero para usar el mysql con llamadas json ? como seria... ?
Leonidas, que compatibilidad tiene con los navegadores antiguos?
Hola Leonidas, gracias por el contenido, pero tengo una duda no hay mucha información sobre fetch delete, lo estoy intentando sin embargo no me funciona. ni modo tendré que hacerlo con ajax por ahora
Muy bueno el vídeo y muy bien explicado pero me quedan dudas. Si quiero obtener más datos del json, como por ejemplo las clases o los ataques ¿tengo que crear una nueva función para cada cosa como puse en el ejemplo al final o hay manera de extraer todo a una constante y extraer cada dato que necesite?
(ejemplo)
.then(pokemon => {
renderizarPokemon(pokemon.sprites.front_default)
nombrePokemon(pokemon.name)
for (let i= 0; i < pokemon.types.length; i++) {
tipoPokemon(pokemon.types[i].type.name)
}
})
Gracias de nuevo por los vídeos, aprendo mucho :D
Hola quise hacer lo mismo con blob pero para acceder a un video, y a partir de ahí me salió error o archivo no encontrado siendo que esta en la misma carpeta, con las imagenes no sucedió lo mismo, que puede estar pasando
Hola leonidas, me gustaría una clase sobre promesas, gracias desde Tarapoto - Perú
no se diga más
Se puede usar fetch para obtener la ip local? Voy 2 días investigando y solo encuentro que se puede hacer con APIs externas y necesito obtener la
Ip de una máquina que no está conectada al internet 😕
Quiero tambien la clase de Promesas y la comparacionde de bundlerss (WEBPACK, ROLLUP PARCELL)
Ante todo gracias por tus videos Leonidas ,
si te puedo pedir como enviamos por metodo post datos de un formulario a una api rest. porfas si fuera posible Leonidas.
gracias nuevamente.
Hola Leonidas, soy fan del trabajo que realizas y aun mas fan del tema que usas, me gustaria saber con exactitud que tema usas de vscode y con que configuración... saludos (Pondre este mismo sms en tud videos hasta que me respondas jajajjj)
Un vídeo de Asíncronia y EventLoop :D
como se aplicaria para obtener un array desde un router que punta aun controlador que tiene un index que devuelve un array
?
promesas & async/await :)
:O mind blowing
Hola, excelente video, muchas gracias, sola una duda:
Por lo que veo con fetch solo puedes acceder a la ultima respuesta (la 200), pero si por ejemplo envío una petición a una url y la respuesta es una redirección (301) y quisiera acceder a los headers o contenido de la misma, ¿es posible?, viendo el contenido del response de fetch hay un atributo redirect, pero siempre me marca true, quisiera poder accerder o saber si hay una forma de hacerlo a todas las respuestas intermedias antes de devolver un código 200, espero me puedas responder, me super urge :c.
porque cuando pongo en el fetch una url que me da spring boot, no me trae los datos?
Hola, muy buen video, como se envian varios elementos con el mismo nombre?
¿Existe un curso en Platzi para aprender mas a fondo cómo configurar e implementar peticiones?
post put y delete en que parte del video vienen?
Un crud se podrá hacer?
Cómo hago para guardar ese json que recibo en una variable?
Amigo pregunta yo cree una api de shopify Yo puedo registrar modificar eliminar etc desde un formulario de mi localhost y me actualiza mi tienda en shopify pero cuando en el postman en el body json coloco los datos mi api no me lee los campos me sale como indefinidos. Tengo conflictos ya que en mi api yo recibo las variables a través de un post tienes algún curso de algo similar?
Qué libros recomiendas de JavaScript que todos deben leer y cuál es su orden. Gracias bien video
You don’t know JavaScript es un buen comienzo
@@LeonidasEsteban gracias 😊. Cuando lo lea te aviso
¿Como puedo guardar el resultado de un Fech en una variable para poder declararlo de manera global ?
Necesitaria hacer un CRUD sobre un fichero JSOn tienes algun ejemplo que me pueda descargar ???
Además de la clase de promesas una de RXJS sería chevere.
Le echaré un ojo, nunca la he usado 😅
Muy buena clase leonidas (Y), que tal un menu hamburguesa sin bootstrap, con css, js y html??
Excelente idea!
hola por compartir tanto conocimiento, como puedo pasar el valor de un a php
Si deseas hacerlo con ajax usa con fetch y capturas el dato con javascript o tambien lo puedes enviar directamente desde el form de html
@@calceta888 Por favor me podria regalar un ejemplo gracias
Como le haces que cuando seleccionas parte del código lo identas hacia atrás¿? No se si se entienda mi pregunta...
En teclado en inglés es con command + [
Gracias por la explicacion, se pude usar fetch con async-await?
Claro, mira la siguiente clase que te explico como
Los archivos de la clase donde estan?
me da error me sale: error SyntaxError: Unexpected token < in JSON at position 0
Hola, si me gustaría una clase acerca de promesas, Saludos.
Aquí lo tienes > Promises en JavaScript ruclips.net/video/EVQR8TjjAWA/видео.html