Jajajaj, de casualidad no lees los pensamientos de tus suscriptores, por que justamente anoche esta solucionando un problema de cors, jajaja el mundo es un pañuelo... Muchas gracias por el video 👌
Por fin encuentro un video que explica este tema. Aunque ya habia resuelto esto cuando me dio dolores de cabeza solo lo habia solucionado pero sin entender lo que estaba haciendo... gracias por el video y la explicación. Genial!!!
Todo lo que necesitaba. Siempre me tocaba usar CORS Anywhere sin saber el motivo. Ahora ya todo claro, configuraré las cabeceras desde mi backend. Muchas gracias crack.
El video que me hubiera encantado encontrar cuando me tope con este tema las primeras veces. Muy claro. Gracias. Te felicito por el contenido que generas.
Рік тому
Es el video que más he estado esperando... Muchísimas gracias!!!
Buenisimo!!!, hace poco me paso que copie el link de varias imágenes de una pagina para mostrarlas en un componente de React y no me dejaba, creí que era un error mío con algún useEfect que me falto pero era un error de cors y como era una página a donde no podía acceder al código del backend no me quedo otra que literalmente descargarlas y usarlas
Muchas gracias Fazt, eres un grande, me habría venido bien ver este video hace 2 días que tuve problemas en proyecto justamente por el CORS, pero bueno, con el video me ha quedado súper claro ese tema. ❤
Totalmente cierto , se encarga de poder hacer peticiones URL http de UN dominio a otro , yo trabajo con Los cors en php para poder consumir las peticiones de base de datos mediante reactJs de lo contrario sino le pongo Los cors no puedo hacer peticiones de una url a Otra
Por cierto con Vite puedes hacer de proxy para evitar configurar cors asi la petición la hace contra vite y luego la redirige al backend asi se salta el error
Que gran video fazt, como siempre. Una consulta: ¿Que font o tipografia estas usando cuando muestras como solucinar el problema de cors con distintos lenguajes?
CORS: *Access-Control-Allow-Methods: Este encabezado indica los métodos HTTP que están permitidos para acceder al recurso en cuestión. *Access-Control-Allow-Headers: Este encabezado especifica los encabezados HTTP personalizados que están permitidos en las solicitudes CORS. *Access-Control-Allow-Credentials: Este encabezado indica si se deben permitir las credenciales, como las cookies, en las solicitudes CORS. *Access-Control-Expose-Headers: Este encabezado permite que los encabezados HTTP personalizados sean accesibles en la respuesta a la solicitud CORS. *Access-Control-Max-Age: Este encabezado especifica el tiempo máximo en segundos durante el cual el navegador puede realizar solicitudes CORS sin enviar una nueva solicitud de pre-vuelo. Estos encabezados se utilizan en conjunto con Access-Control-Allow-Origin para definir y restringir el acceso a recursos de diferentes dominios, lo que ayuda a proteger la seguridad de los datos del usuario y prevenir ataques de XSS.
Si van a usar el flag de credentials, no pueden usar * ni un Array de control-allow-origins. En ese caso, simplemente desde el backend lean el header de origin, lo guardan en una variable, y ese es el que permiten. Para mas seguridad, si se crean un array de dominios autorizados, y solo hacen el set header si el origin solicitado esta en esa lista. De nada ;)
Lo unico que no entiendo es cuando haces una petición de un backend a otro backend el cors no frena la petición, solo protege del frontend al backend, es confuso para mí.
Siempre uso CORS... Porque en generalmente uso Node, Java, Python, Ruby para backend. Pero en ultimo proyecto que estoy trabajando tengo backend con Laravel version 8... El lider tecnico menciono especificamente que no deberia de poner CORS en Laravel. Apoco lenguaje / framework que se usa afecta en eso?
Este es un problema que aparece cada vez que creas una apliacacion cliente-api... Lo he padecido tanto con Vue -> php como con ReactNative -> php, este ultimo enviando con Axios y recibir Authotization, claves y dejar todo las prolijo. Pero ya uno se curte y putea menos. jaja
Fazt y cuando el código se manda a producción, vamos a tener que cambiar el dominio local a nuestro dominio dónde se ubica el frontend ( supongo ) verdad?
Si tienes que colocar el dominio de producción de tu frontend cuando lo despliegues, es por esto que puedes crear configuraciones para desarrollo y producción
Hola Fazt, excelente video, tengo una inquietud debido a mi experiencia haciendo web scraping, existen servidores que obviamente por medidas de seguridad tienen una lista de dominios o subdominios CORS permitidos en su backend, tradicionalmente la dinámica web scraping implica que no se tiene acceso al código del backend, ¿qué se podría hacer en este caso? ¿sí quiero, por ejemplo, consumir una API de un tercero? una solución muy "divertida" (y estoy siendo amable con las políticas de seguridad de algunas API desplegadas en el entorno donde trabajo) es mediante Postman/Newman o software similar. ¿existe una forma de hacerlo propiamente en el fronted? por ejemplo, una librería en JS que emule una petición de desarrollo como lo hace Postman. Por cierto, la anterior es una de estas formas.
faz como estas ?? se que es ya como que muy tarde aclarar duda con este tema. Es que tengo un API con PHP y le puse todos esos encabezados y me funciona a la perfeccion localmente al consumirla y hacer peticiones con reactjs, pero cuando despliego la API de PHP al servidor apache de debian12 no me funciona la API incluso cuando le hago las peticiones no funciona y me arroja error 404. Por favor ayuda , alguien.
No viene al caso, pero a alguien puede ayudar, para los que usan sockets con sockeio: los de socketio deben setear su propia configuración a nivel de sockets, independiente a la configuración del servidor.
Que solución habría si no tengo control del backend?. Me pasa por ejemplo al tratar de leer imagenes de cualquier otro dominio, y en mi frontend (React) no puedo debido al CORS
Este es un problema muy recurrente, te falto decir que todo esto es cuando tienes tu front y back en el mismo servidor... Yo tuve ese problema en angular y sólo lo pude solucionar al poner mi back en otro servidor... Claro quizá ese servidor si tenía la configuración correcta... El front es muy apasionante, todos queremos hacer front, pero cuando subes todo a tu vps inicia el "verdadero terror"....
Puedes hacer peticiones directas al servidor desde programas como Postman o Clientes REST similares, o tambien puedes usar proxies cors, desde otros servicios para que puedas hacer la peticion, aunque esto significa que tus peticiones pasan por un tercero
Nunca me quedo tan claro la explicación de CORS , siempre ponía "*" para evitarme dolores de cabeza , gracias Fazt , estuvo increíble el video.
El video que nadie pidió pero TODOS necesitabamos ❤
0:10 ]}>
❤😂🎉😢😮😅😊
@@فاگمهنوری Desesperadamente
Tanto lio para entender el molestoso CORS, con un simple video queda mas que CLARO, gracias Fazt
Jajajaj, de casualidad no lees los pensamientos de tus suscriptores, por que justamente anoche esta solucionando un problema de cors, jajaja el mundo es un pañuelo... Muchas gracias por el video 👌
El algoritmo 😂😂😂😂
En su dia me pelee muchísimo con esto, cuando recién salio me volví loco, que suerte para los nuevos, muy bien explicado
Muy clara tu forma de explicar. Ahora por fin pude comprender CORS. Muchas gracias Fazt.
Por fin encuentro un video que explica este tema. Aunque ya habia resuelto esto cuando me dio dolores de cabeza solo lo habia solucionado pero sin entender lo que estaba haciendo... gracias por el video y la explicación. Genial!!!
Todo lo que necesitaba. Siempre me tocaba usar CORS Anywhere sin saber el motivo. Ahora ya todo claro, configuraré las cabeceras desde mi backend. Muchas gracias crack.
Gracias amigo, estoy aprendiendo por mi cuenta y cuando consiga solventar esto, podré hacer muchas cosas. Gracias de nuevo amigo un saludo.
La mejor explicacion que he visto sobre CORS, gracias por compartirla!!!
El video que me hubiera encantado encontrar cuando me tope con este tema las primeras veces. Muy claro. Gracias.
Te felicito por el contenido que generas.
Es el video que más he estado esperando... Muchísimas gracias!!!
Gracias Fazt, imposible explicarlo mejor para entenderlo mejor que nunca como que hay un "prefech options" jeje :)
Es increíble, fazt habla y es tutorial puro..... gracias!
Gracias 🎉, soy android dev pero también me gusta el desarrollo web ❤
Buenisimo!!!, hace poco me paso que copie el link de varias imágenes de una pagina para mostrarlas en un componente de React y no me dejaba, creí que era un error mío con algún useEfect que me falto pero era un error de cors y como era una página a donde no podía acceder al código del backend no me quedo otra que literalmente descargarlas y usarlas
Muchas gracias Fazt, eres un grande, me habría venido bien ver este video hace 2 días que tuve problemas en proyecto justamente por el CORS, pero bueno, con el video me ha quedado súper claro ese tema. ❤
Qué crack, de este tema tenía conocimientos básicos y desconocía muchas cosas más, pero aprendí todo lo que desconocía 😁😁
Te admiro mucho bro, gracias por el buen contenido
Que explicación más clara, se agradece bro
justamente tuve el problema ayer jajajaja parece a proposito, gracias fatz!
Totalmente cierto , se encarga de poder hacer peticiones URL http de UN dominio a otro , yo trabajo con Los cors en php para poder consumir las peticiones de base de datos mediante reactJs de lo contrario sino le pongo Los cors no puedo hacer peticiones de una url a Otra
Gracias Fazt! Me sirvio un montón esta info!
FAZT como es posible que algo tan sencillo como el cors recién lo expliques 7 años despues, esto me hubiera servido mucho hace 1 año T.T
Me he tardado un poco jaja
Súper útil e informativo!! Fazt, para cuando el curso en Nginx? Hace años lo estás prometiendo. Saludos!!
Dale lo publico muy pronto :)
Excelente como siempre Muchas gracias por la explicacion Fazt!!
Excelente explicación, muy importante. Gracias maestro!
Increíbles videos, un saludo ❤️💪🏻
Ame esos ejemplos en varios lenguajes 👍
Por cierto con Vite puedes hacer de proxy para evitar configurar cors asi la petición la hace contra vite y luego la redirige al backend asi se salta el error
Buenas, puedes pasar la documentacion sobre eso por favor
Entendiendo que son CORS en Agosto 2024 ;) buena explicación.
Por que no llegaste mas tempranooo me toco aprender esto por mi cuenta y a la mala ahhaha pero gracias por ayudarnos con tus tutos ♥
Excelente explicación. Gracias.
excelente explicación, muchas gracias!!!!!
Excelente video!, había visto eso pero no tan bien explicado.
Como siempre un increíble vidio xd btw me encantaría uno de CMS headless que es un tema del que no he escuchado tanto y lo veo muy interesante
Gracias Jose, te dejo el video de Headless CMS: ua-cam.com/video/2lLddtCgZ98/v-deo.html
Buen video, muy bien explicado!
Exelente video .. gracias brohh
Excelente vídieo como siempre
Que gran video fazt, como siempre. Una consulta: ¿Que font o tipografia estas usando cuando muestras como solucinar el problema de cors con distintos lenguajes?
La encontre en nerd fonts: Mononoki Nerd Font :)
Gracias por los videos!
Muchas gracias Fazt. Tengo una duda como se soluciona en el caso de Next.JS. Estoy trabajando con la versiones 13.4
CORS:
*Access-Control-Allow-Methods: Este encabezado indica los métodos HTTP que están permitidos para acceder al recurso en cuestión.
*Access-Control-Allow-Headers: Este encabezado especifica los encabezados HTTP personalizados que están permitidos en las solicitudes CORS.
*Access-Control-Allow-Credentials: Este encabezado indica si se deben permitir las credenciales, como las cookies, en las solicitudes CORS.
*Access-Control-Expose-Headers: Este encabezado permite que los encabezados HTTP personalizados sean accesibles en la respuesta a la solicitud CORS.
*Access-Control-Max-Age: Este encabezado especifica el tiempo máximo en segundos durante el cual el navegador puede realizar solicitudes CORS sin enviar una nueva solicitud de pre-vuelo.
Estos encabezados se utilizan en conjunto con Access-Control-Allow-Origin para definir y restringir el acceso a recursos de diferentes dominios, lo que ayuda a proteger la seguridad de los datos del usuario y prevenir ataques de XSS.
Hola ,una consulta ,quiero inpeccionar una web,pero apenas apretó (f12) me redicciona , eso como puedo solucionarlo?🙏🏼
Si van a usar el flag de credentials, no pueden usar * ni un Array de control-allow-origins. En ese caso, simplemente desde el backend lean el header de origin, lo guardan en una variable, y ese es el que permiten. Para mas seguridad, si se crean un array de dominios autorizados, y solo hacen el set header si el origin solicitado esta en esa lista. De nada ;)
Que procede cuando solo hice un proyecto react de front end usando una API que no es mía? No puedo moverle al servidor
Y si la request es a un endpoint al que no tengo acceso al código? Es decir, no tengo acceso al backend
Si no lo podemos solucionar desde el front es valido crear un server proxy para evitar los cors? (Asumiendo que no tenemos acceso al back)
Como haces los videos y animaciones de las flechas e íconos?
Muchas gracias por la explicación, un crack c:
Excelente explicacion
gracias por la explicacion
quiero colocar un en video hls y me sale error de cors , resulta que el video no funciona en https y no logro incrustrarlo en mi paguina alguna ayuda
Lo unico que no entiendo es cuando haces una petición de un backend a otro backend el cors no frena la petición, solo protege del frontend al backend, es confuso para mí.
TE AMO MEN
Siempre uso CORS... Porque en generalmente uso Node, Java, Python, Ruby para backend. Pero en ultimo proyecto que estoy trabajando tengo backend con Laravel version 8... El lider tecnico menciono especificamente que no deberia de poner CORS en Laravel. Apoco lenguaje / framework que se usa afecta en eso?
Amazing 🔥🔥
Oro puro , muchas gracias
Este es un problema que aparece cada vez que creas una apliacacion cliente-api... Lo he padecido tanto con Vue -> php como con ReactNative -> php, este ultimo enviando con Axios y recibir Authotization, claves y dejar todo las prolijo. Pero ya uno se curte y putea menos. jaja
Si tengo un problema de CORS pero con una API externa, como puedo solucionarlo?
Fas te amo
Fazt y cuando el código se manda a producción, vamos a tener que cambiar el dominio local a nuestro dominio dónde se ubica el frontend ( supongo ) verdad?
Si tienes que colocar el dominio de producción de tu frontend cuando lo despliegues, es por esto que puedes crear configuraciones para desarrollo y producción
Hola Fazt, excelente video, tengo una inquietud debido a mi experiencia haciendo web scraping, existen servidores que obviamente por medidas de seguridad tienen una lista de dominios o subdominios CORS permitidos en su backend, tradicionalmente la dinámica web scraping implica que no se tiene acceso al código del backend, ¿qué se podría hacer en este caso? ¿sí quiero, por ejemplo, consumir una API de un tercero? una solución muy "divertida" (y estoy siendo amable con las políticas de seguridad de algunas API desplegadas en el entorno donde trabajo) es mediante Postman/Newman o software similar. ¿existe una forma de hacerlo propiamente en el fronted? por ejemplo, una librería en JS que emule una petición de desarrollo como lo hace Postman. Por cierto, la anterior es una de estas formas.
faz como estas ?? se que es ya como que muy tarde aclarar duda con este tema. Es que tengo un API con PHP y le puse todos esos encabezados y me funciona a la perfeccion localmente al consumirla y hacer peticiones con reactjs, pero cuando despliego la API de PHP al servidor apache de debian12 no me funciona la API incluso cuando le hago las peticiones no funciona y me arroja error 404. Por favor ayuda , alguien.
como lo solucionaste ? yoi ando igual pero con java en spring boot
Cual es la ruta de aprendizaje para saber todo lo que usted domina?
No viene al caso, pero a alguien puede ayudar, para los que usan sockets con sockeio: los de socketio deben setear su propia configuración a nivel de sockets, independiente a la configuración del servidor.
gracias man sos un capo
Que solución habría si no tengo control del backend?. Me pasa por ejemplo al tratar de leer imagenes de cualquier otro dominio, y en mi frontend (React) no puedo debido al CORS
Hola Fazt saludos. Me gustaría saber que distro de Linux utiliza ❤
De momento Xubuntu es la distro que uso :)
Que pasa si es una api intentando comunicarse con otra api de diferente dominio?
Cuando se trata de multiples Backend comunicandose no hay problema, porque el tema de CORS es un asunto del navegador
Este es un problema muy recurrente, te falto decir que todo esto es cuando tienes tu front y back en el mismo servidor... Yo tuve ese problema en angular y sólo lo pude solucionar al poner mi back en otro servidor... Claro quizá ese servidor si tenía la configuración correcta... El front es muy apasionante, todos queremos hacer front, pero cuando subes todo a tu vps inicia el "verdadero terror"....
Y si no temgo acceso al servidor v:?
Graciasssss !!!!!
Que consola usas en powershell
es ohmyposh: ua-cam.com/video/d9y0l7yY404/v-deo.html
Master 😈
que hacer si no tienes acceso al servidor
Puedes hacer peticiones directas al servidor desde programas como Postman o Clientes REST similares, o tambien puedes usar proxies cors, desde otros servicios para que puedas hacer la peticion, aunque esto significa que tus peticiones pasan por un tercero
terrrrrible gracias!
Punto con
Primero🥷🏼✨🔥
C😈RS significa Hola Demonio!
maldito cors jajajaja🤣