Admitir HTTPS en tu sitio web es un paso importante para proteger tu sitio y a los usuarios contra ataques, pero el contenido mixto puede inutilizar esta protección. Los navegadores bloquearán el contenido mixto cada vez más inseguro, como se explica en ¿Qué es el contenido mixto?
En esta guía, demostraremos técnicas y herramientas para solucionar problemas existentes de contenido mixto. y evitar que ocurran nuevos.
Visita tu sitio para encontrar contenido mixto
Cuando visitas una página HTTPS en Google Chrome, el navegador te alertará sobre contenido mixto con errores y advertencias en la consola de JavaScript.
En ¿Qué es el contenido mixto?, Puedes encontrar una serie de ejemplos y ver cómo se informan los problemas en las Herramientas para desarrolladores de Chrome.
El ejemplo de contenido mixto pasivo mostrará las siguientes advertencias.
Si el navegador puede encontrar el contenido en una URL https, lo actualiza automáticamente y muestra un mensaje.
El contenido mixto activo está bloqueado y muestra una advertencia.
Si ves advertencias como estas para las URLs de http:// de tu sitio,
debes corregirlos en la fuente de tu sitio.
Es útil hacer una lista de estas URLs, junto con la página en la que las encontraste, para usarla cuando las corrijas.
Cómo encontrar contenido mixto en tu sitio
Puedes buscar contenido mixto directamente en tu código fuente.
Busca http:// en tu fuente y busca etiquetas que incluyan atributos de URL HTTP.
Ten en cuenta que tener http:// en el atributo href de las etiquetas de anclaje (<a>)
no suele ser un problema de contenido mixto, con algunas excepciones notables que se analizan más adelante.
Si tu sitio se publica usando un sistema de administración de contenido, es posible que se inserten vínculos a URL no seguras cuando se publiquen las páginas. Por ejemplo, las imágenes se pueden incluir con una URL completa en lugar de una ruta de acceso relativa. Deberás encontrarlos y corregirlos en el contenido del CMS.
Cómo corregir el contenido mixto
Una vez que encuentres el contenido mixto en la fuente de tu sitio, puedes seguir estos pasos para solucionarlo.
Si recibes un mensaje de la consola que indica que la solicitud de un recurso se actualizó automáticamente de HTTP a HTTPS,
puedes cambiar de forma segura la URL http:// del recurso en tu código a https://.
También puedes verificar si un recurso está disponible de forma segura cambiando http:// a https:// en la barra de URL del navegador.
e intento abrir la URL en una pestaña del navegador.
Si el recurso no está disponible a través de https://, debes considerar una de las siguientes opciones:
- Incluye el recurso desde un host diferente, si hay uno disponible.
- Descarga y aloja el contenido directamente en tu sitio si tienes la autorización legal para hacerlo.
- Excluye el recurso de tu sitio por completo.
Una vez solucionado el problema, Accede a la página donde encontraste el error y verifica que ya no aparezca.
Ten cuidado con el uso no estándar de etiquetas
Ten cuidado con el uso no estándar de etiquetas en tu sitio.
Por ejemplo, las URLs de etiquetas de anclaje (<a>) no generan errores de contenido mixto.
ya que provocan que el navegador navegue a una página nueva.
Esto significa que, por lo general, no es necesario corregirlas.
Sin embargo, algunas secuencias de comandos de la galería de imágenes anulan la funcionalidad de <a>.
etiqueta y carga el recurso HTTP especificado por el atributo href en una pantalla lightbox en la página.
lo que causa problemas de contenido mixto.
Cómo manejar contenido mixto a gran escala
Los pasos manuales descritos anteriormente funcionan bien en sitios web más pequeños. pero para sitios web grandes o sitios con varios equipos de desarrollo independientes, Puede ser difícil hacer un seguimiento de todo el contenido que se carga. Para ayudarte con esta tarea, puedes usar la política de seguridad del contenido para indicarle al navegador que te notifique acerca del contenido mixto y asegurarte de que tus páginas nunca carguen recursos inseguros de manera inesperada.
Política de seguridad del contenido
Política de Seguridad del Contenido (CSP) es una función multipropósito del navegador que puedes usar para administrar contenido mixto a escala. El mecanismo de informes de CSP puede usarse para hacer un seguimiento del contenido mixto de tu sitio y proporcionar políticas de aplicación para proteger a los usuarios a través de la actualización o el bloqueo de contenido mixto.
Puedes habilitar estas funciones para una página incluyendo el
Los encabezados Content-Security-Policy o Content-Security-Policy-Report-Only en la respuesta enviada desde tu servidor
Además, puedes configurar Content-Security-Policy
(aunque no Content-Security-Policy-Report-Only) con una etiqueta <meta> en la sección <head> de tu página.
Encuentra contenido mixto con la política de seguridad de contenido
Puedes usar la política de seguridad del contenido para recopilar informes sobre contenido mixto en tu sitio.
Si quieres habilitar esta función, agrega la directiva Content-Security-Policy-Report-Only como un encabezado de respuesta para tu sitio y establece la directiva.
Encabezado de respuesta:
Content-Security-Policy-Report-Only: default-src https: 'unsafe-inline' 'unsafe-eval'; report-uri https://example.com/reportingEndpoint
Cada vez que un usuario visita una página de tu sitio,
su navegador envía informes en formato JSON sobre cualquier elemento que infrinja la política de seguridad de contenido a
https://example.com/reportingEndpoint
En este caso, cada vez que se carga un subrecurso a través de HTTP, se envía un informe.
Estos informes incluyen la URL de la página en la que se produjo el incumplimiento de política y la URL del subrecurso que infringió la política.
Si configuras el extremo de informes para registrar estos informes,
puedes hacer un seguimiento del contenido mixto de tu sitio sin tener que visitar cada página.
Las dos advertencias son las siguientes:
- Los usuarios deben visitar tu página en un navegador que comprenda el encabezado de CSP. La mayoría de los navegadores actuales pueden hacerlo.
- Solo obtienes informes de las páginas que visitan tus usuarios. Por lo tanto, si sus páginas no reciben mucho tráfico es posible que pase un tiempo antes de que recibas informes de todo tu sitio.
La Política de seguridad del contenido en esta guía hay más información y un extremo de ejemplo.
Alternativas a los informes con CSP
Si tu sitio se aloja en una plataforma como Blogger, es posible que no tengas acceso para modificar los encabezados ni agregar una CSP. En su lugar, una alternativa viable podría ser utilizar un rastreador de sitios web para encontrar problemas en tu sitio, como los siguientes: HTTPSChecker o Análisis de contenido mixto.
Actualiza solicitudes no seguras
Los navegadores están empezando a actualizarse y bloquear las solicitudes no seguras. Puedes usar directivas de CSP para forzar la actualización o el bloqueo automáticos de estos recursos.
La upgrade-insecure-requests
La directiva de CSP indica al navegador que actualice las URLs no seguras antes de realizar solicitudes de red.
Por ejemplo, si una página contiene una etiqueta de imagen con una URL HTTP como
<img src="http://example.com/image.jpg">
En su lugar, el navegador realiza una solicitud segura de
https://example.com/image.jpg, lo que evita al usuario del contenido mixto.
Para habilitar este comportamiento, envía un encabezado Content-Security-Policy con esta directiva:
Content-Security-Policy: upgrade-insecure-requests
También puedes incorporar esa misma directiva intercalada en el <head> del documento.
mediante un elemento <meta>:
<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
Al igual que con la actualización automática del navegador, si el recurso no está disponible en HTTPS,
la solicitud actualizada falla y el recurso no se carga.
Esto permite preservar la seguridad de tu página. La directiva upgrade-insecure-requests irá más allá de la actualización automática del navegador.
que intentan actualizar las solicitudes
que el navegador no admite actualmente.
La directiva upgrade-insecure-requests cae en cascada a documentos <iframe>,
asegurándose de que toda la página esté protegida.