• ¡Obtenga la seguridad de la aplicación de la manera correcta! Detectar, proteger, monitorear, acelerar y más ...
  • Restrinja o permita el uso compartido de recursos entre sitios mediante el encabezado CORS.

    El encabezado CORS (intercambio de recursos de origen cruzado) es compatible con todos los navegadores modernos.

    ¿Puedo usar cors? Datos sobre la compatibilidad con la función cors en los principales navegadores de caniuse.com.

    De forma predeterminada, el navegador restringe las solicitudes HTTP de origen cruzado mediante scripts. Y, CORS Puede ser útil reutilizar los recursos de aplicaciones comunes en otras aplicaciones web. Una vez que se agrega correctamente, indica al navegador que cargue la aplicación desde un origen diferente.

    Hay seis tipos populares de encabezados CORS que puede enviar un servidor. Explorémoslos.

    Access-Control-Allow-Origin

    El más popular que le dice al navegador que cargue los recursos en el origen permitido. Admite comodines (*) y, al hacerlo, cualquier dominio puede cargar los recursos. Sin embargo, tiene la opción de permitir un origen específico.

    APACHE

    Agregue lo siguiente en httpd.conf o cualquier otro archivo de configuración en uso.

    Header set Access-Control-Allow-Origin "*"

    Reinicie Apache para probar. Debería verlos en los encabezados de respuesta.

    Y, para permitir desde un origen específico (por ejemplo: https://gf.dev), puede usar lo siguiente.

    Header set Access-Control-Allow-Origin "https://gf.dev"

    Nginx

    Aquí hay un ejemplo para permitir el origen https://geekflare.dev. Agregue lo siguiente en el server bloque de nginx.conf o archivo de configuración en uso.

    add_header Access-Control-Allow-Origin "https://geekflare.dev";

    Access-Control-Allow-Methods

    El navegador puede iniciar uno o más métodos HTTP para acceder a los recursos. Ej: - OBTENER, PONER, OPCIONES, PONER, ELIMINAR, PUBLICAR

    APACHE

    Para permitir solo GET y POST.

    Header add Access-Control-Allow-Methods "GET, POST"

    Nginx

    Digamos que necesita agregar los métodos DELETE y OPTIONS, luego puede agregarlos como se muestra a continuación.

    add_header Access-Control-Allow-Methods "DELETE, OPTIONS";

    Después del reinicio, debería verlos en los encabezados de respuesta.

    Access-Control-Allow-Headers

    Los siguientes encabezados están en lista segura, lo que significa que no es necesario agregar uno. Debería funcionar de forma predeterminada.

    • Content-Type
    • Aceptar
    • Contenido-Idioma
    • Aceptar lenguaje

    Sin embargo, si necesita agregar uno personalizado, puede hacerlo. Admite uno o más encabezados.

    APACHE

    Digamos que quieres permitir X-Custom-Header y X-Powered-By encabezados.

    Header always set Access-Control-Allow-Headers "X-Custom-Header, X-Powered-By"

    Después de un reinicio, debería ver el resultado en los encabezados de respuesta.

    Nginx

    Un ejemplo de cómo agregar X-Customer-Software y X-My-Custom encabezado.

    add_header Access-Control-Allow-Headers "X-Custom-Software, X-My-Custom";

    Access-Control-Expose-Headers

    Los siguientes encabezados ya son una lista segura. Significa que no necesita agregar si desea exponerlos.

    • Expira
    • Pragma
    • Cache-Control
    • Última modificación
    • Contenido-Idioma
    • Content-Type

    Pero, si necesita algo más que la lista segura, puede permitirlos de la siguiente manera.

    APACHE

    Utilice un comodín para exponer todos los encabezados.

    Header always set Access-Control-Expose-Headers "*"

    Nota: un comodín aún no expone Authorization encabezado, y si lo necesita, debe mencionarlo explícitamente.

    Header always set Access-Control-Expose-Headers "Authorization, *"

    El resultado debería verse así.

    Nginx

    Si quieres exponer Origin cabecera.

    add_header Access-Control-Expose-Headers "Origin";

    Access-Control-Max-Age

    ¿Conoce los datos de Access-Control-Allow-Headers y Access-Control-Allow-Methods los encabezados se pueden almacenar en caché? Se puede almacenar en caché hasta 24 horas en Firefox, 2 horas en Chrome (76+).

    Para deshabilitar el almacenamiento en caché, puede mantener el valor como -1

    APACHE

    Almacenar en caché durante 15 minutos.

    Header always set Access-Control-Max-Age "900"

    Como puede ver, el valor está en segundos.

    Nginx

    Almacenar en caché durante una hora.

    add_header Access-Control-Max-Age "3600";

    Una vez agregado, reinicie Nginx para ver los resultados.

    Access-Control-Allow-Credentials

    Solo hay una opción para configurar aquí: verdadero. This es permitir si desea exponer credenciales como cookies, certificados TLS, autorización.

    APACHE

    Header always set Access-Control-Allow-Credentials "true"

    Nginx

    add_header Access-Control-Allow-Credentials "true";

    y el resultado.

    Verificando los resultados

    Una vez que se agregan los encabezados necesarios, puede utilizar las herramientas de desarrollo integradas del navegador o un verificador de encabezado HTTP en línea.

    En resumen

    Espero que lo anterior le ayude a implementar el encabezado CORS en Apache HTTP y el servidor web Nginx para una mejor seguridad. También te puede interesar postularte Encabezados seguros recomendados por OWASP.