Aplicación de una directiva de seguridad de contenido para Blazor de ASP.NET Core
Nota
Esta no es la versión más reciente de este artículo. Para la versión actual, consulte la versión de .NET 9 de este artículo.
Advertencia
Esta versión de ASP.NET Core ya no se admite. Para obtener más información, consulta la Directiva de soporte técnico de .NET y .NET Core. Para la versión actual, consulta la versión .NET 8 de este artículo.
Importante
Esta información hace referencia a un producto en versión preliminar, el cual puede sufrir importantes modificaciones antes de que se publique la versión comercial. Microsoft no proporciona ninguna garantía, expresa o implícita, con respecto a la información proporcionada aquí.
Para la versión actual, consulte la versión de .NET 9 de este artículo.
En este artículo se explica cómo usar una directiva de seguridad de contenido (CSP) con aplicaciones Blazor de ASP.NET Core para protegerse frente a ataques de scripting entre sitios (XSS).
Scripting entre sitios (XSS) es una vulnerabilidad de seguridad en la que un ciberdelincuente coloca uno o más scripts de cliente malintencionados en el contenido representado de una aplicación. Una CSP ayuda a protegerse de ataques XSS, ya que informa al explorador de la validez de los elementos siguientes:
- Orígenes de contenido cargado, incluidos scripts, hojas de estilo, imágenes y complementos.
- Acciones realizadas por una página, especificando los destinos de URL permitidos de formularios
Para aplicar una directiva de seguridad de contenido en una aplicación, el desarrollador especifica varias directivas de seguridad de contenido en uno o varios encabezados Content-Security-Policy
o etiquetas <meta>
. Para obtener instrucciones sobre cómo aplicar una CSP a una aplicación en código de C# al inicio, vea Inicio de Blazor de ASP.NET Core.
El explorador evalúa las directivas mientras una página se carga. Así, inspecciona los orígenes de la página y determina si cumplen los requisitos de las directivas de seguridad de contenido. Cuando un recurso no cumple estas directivas, el explorador no lo carga. Pensemos, por ejemplo, en una directiva que no permite scripts de terceros. Si una página contiene una etiqueta <script>
con un origen de terceros en el atributo src
, el explorador impide que el script se cargue.
Las directivas de seguridad de contenido se admiten en la mayoría de los exploradores de escritorio y móviles de hoy día, como Chrome, Edge, Firefox, Opera y Safari. Se recomienda usarlas en aplicaciones Blazor.
Directivas
Especifique como mínimo las siguientes directivas y orígenes en las aplicaciones Blazor. Agregue más directivas y orígenes según sea necesario. Las siguientes directivas se usan en la sección Aplicación de la directiva de este artículo, donde se proporcionan directivas de seguridad de ejemplo para Blazor:
- base-uri: restringe las direcciones URL según la etiqueta
<base>
de una página. Especifiqueself
para indicar que el origen de la aplicación (incluido el esquema y el número de puerto) es un origen válido. - default-src: indica una reserva de las directivas de origen que no se han especificado expresamente en la directiva. Especifique
self
para indicar que el origen de la aplicación (incluido el esquema y el número de puerto) es un origen válido. - img-src: indica los orígenes de imágenes válidos.
- Especifique
data:
para permitir la carga de imágenes de direcciones URLdata:
. - Especifique
https:
para permitir la carga de imágenes desde puntos de conexión HTTPS.
- Especifique
- object-src: indica los orígenes válidos de las etiquetas
<object>
,<embed>
y<applet>
. Especifiquenone
para no permitir ningún origen de dirección URL. - script-src: indica los orígenes de scripts válidos.
- Especifique
self
para indicar que el origen de la aplicación (incluido el esquema y el número de puerto) es un origen válido. - En una aplicación Blazor del lado cliente:
- Especifique
wasm-unsafe-eval
para permitir que funcione el entorno de ejecución Mono Blazor del lado cliente. - Especifique hashes adicionales para permitir que se carguen los scripts que no son del marco necesarios.
- Especifique
- En una aplicación Blazor del lado servidor, especifique códigos hash para permitir que se carguen los scripts necesarios.
- Especifique
- style-src: indica los orígenes de hojas de estilo válidos.
- Especifique
self
para indicar que el origen de la aplicación (incluido el esquema y el número de puerto) es un origen válido. - Si la aplicación usa estilos en línea, especifique
unsafe-inline
para permitir su uso.
- Especifique
- upgrade-insecure-requests: indica que las direcciones URL de contenido de orígenes (HTTP) no seguros deben adquirirse de forma segura a través de HTTPS.
- base-uri: restringe las direcciones URL según la etiqueta
<base>
de una página. Especifiqueself
para indicar que el origen de la aplicación (incluido el esquema y el número de puerto) es un origen válido. - default-src: indica una reserva de las directivas de origen que no se han especificado expresamente en la directiva. Especifique
self
para indicar que el origen de la aplicación (incluido el esquema y el número de puerto) es un origen válido. - img-src: indica los orígenes de imágenes válidos.
- Especifique
data:
para permitir la carga de imágenes de direcciones URLdata:
. - Especifique
https:
para permitir la carga de imágenes desde puntos de conexión HTTPS.
- Especifique
- object-src: indica los orígenes válidos de las etiquetas
<object>
,<embed>
y<applet>
. Especifiquenone
para no permitir ningún origen de dirección URL. - script-src: indica los orígenes de scripts válidos.
- Especifique
self
para indicar que el origen de la aplicación (incluido el esquema y el número de puerto) es un origen válido. - En una aplicación Blazor del lado cliente:
- Especifique
unsafe-eval
para permitir que funcione el entorno de ejecución Mono Blazor del lado cliente. - Especifique hashes adicionales para permitir que se carguen los scripts que no son del marco necesarios.
- Especifique
- En una aplicación Blazor del lado servidor, especifique códigos hash para permitir que se carguen los scripts necesarios.
- Especifique
- style-src: indica los orígenes de hojas de estilo válidos.
- Especifique
self
para indicar que el origen de la aplicación (incluido el esquema y el número de puerto) es un origen válido. - Si la aplicación usa estilos en línea, especifique
unsafe-inline
para permitir su uso.
- Especifique
- upgrade-insecure-requests: indica que las direcciones URL de contenido de orígenes (HTTP) no seguros deben adquirirse de forma segura a través de HTTPS.
- base-uri: restringe las direcciones URL según la etiqueta
<base>
de una página. Especifiqueself
para indicar que el origen de la aplicación (incluido el esquema y el número de puerto) es un origen válido. - default-src: indica una reserva de las directivas de origen que no se han especificado expresamente en la directiva. Especifique
self
para indicar que el origen de la aplicación (incluido el esquema y el número de puerto) es un origen válido. - img-src: indica los orígenes de imágenes válidos.
- Especifique
data:
para permitir la carga de imágenes de direcciones URLdata:
. - Especifique
https:
para permitir la carga de imágenes desde puntos de conexión HTTPS.
- Especifique
- object-src: indica los orígenes válidos de las etiquetas
<object>
,<embed>
y<applet>
. Especifiquenone
para no permitir ningún origen de dirección URL. - script-src: indica los orígenes de scripts válidos.
- Especifique el origen de host
https://stackpath.bootstrapcdn.com/
para los scripts de arranque. - Especifique
self
para indicar que el origen de la aplicación (incluido el esquema y el número de puerto) es un origen válido. - En una aplicación Blazor del lado cliente:
- Especifique
unsafe-eval
para permitir que funcione el entorno de ejecución Mono Blazor del lado cliente. - Especifique hashes adicionales para permitir que se carguen los scripts que no son del marco necesarios.
- Especifique
- En una aplicación Blazor del lado servidor, especifique códigos hash para permitir que se carguen los scripts necesarios.
- Especifique el origen de host
- style-src: indica los orígenes de hojas de estilo válidos.
- Especifique el origen de host
https://stackpath.bootstrapcdn.com/
para las hojas de estilo de arranque. - Especifique
self
para indicar que el origen de la aplicación (incluido el esquema y el número de puerto) es un origen válido. - Especifique
unsafe-inline
para permitir el uso de estilos en línea.
- Especifique el origen de host
- upgrade-insecure-requests: indica que las direcciones URL de contenido de orígenes (HTTP) no seguros deben adquirirse de forma segura a través de HTTPS.
- base-uri: restringe las direcciones URL según la etiqueta
<base>
de una página. Especifiqueself
para indicar que el origen de la aplicación (incluido el esquema y el número de puerto) es un origen válido. - default-src: indica una reserva de las directivas de origen que no se han especificado expresamente en la directiva. Especifique
self
para indicar que el origen de la aplicación (incluido el esquema y el número de puerto) es un origen válido. - img-src: indica los orígenes de imágenes válidos.
- Especifique
data:
para permitir la carga de imágenes de direcciones URLdata:
. - Especifique
https:
para permitir la carga de imágenes desde puntos de conexión HTTPS.
- Especifique
- object-src: indica los orígenes válidos de las etiquetas
<object>
,<embed>
y<applet>
. Especifiquenone
para no permitir ningún origen de dirección URL. - script-src: indica los orígenes de scripts válidos.
- Especifique el origen de host
https://stackpath.bootstrapcdn.com/
para los scripts de arranque. - Especifique
self
para indicar que el origen de la aplicación (incluido el esquema y el número de puerto) es un origen válido. - En una aplicación Blazor del lado cliente:
- Especifique códigos hash para permitir que se carguen los scripts necesarios.
- Especifique
unsafe-eval
para usareval()
y métodos para crear código a partir de cadenas.
- En una aplicación Blazor del lado servidor, especifique códigos hash para permitir que se carguen los scripts necesarios.
- Especifique el origen de host
- style-src: indica los orígenes de hojas de estilo válidos.
- Especifique el origen de host
https://stackpath.bootstrapcdn.com/
para las hojas de estilo de arranque. - Especifique
self
para indicar que el origen de la aplicación (incluido el esquema y el número de puerto) es un origen válido. - Especifique
unsafe-inline
para permitir el uso de estilos en línea. La declaración en línea es necesaria en la interfaz de usuario para volver a conectar el cliente y el servidor después de la solicitud inicial. En una versión futura, es posible que los estilos en línea se eliminen, de forma queunsafe-inline
ya no sea necesario.
- Especifique el origen de host
- upgrade-insecure-requests: indica que las direcciones URL de contenido de orígenes (HTTP) no seguros deben adquirirse de forma segura a través de HTTPS.
Todos los exploradores, excepto Microsoft Internet Explorer, admiten las directivas anteriores.
Para obtener los hash SHA de otros scripts en línea:
- Aplique la directiva de seguridad de contenido que aparece en la sección Aplicación de la directiva.
- Acceda a la consola de herramientas de desarrollo del explorador mientras ejecuta la aplicación localmente. El explorador calcula y muestra los hash de los scripts bloqueados cuando existe un encabezado de directiva de seguridad de contenido o una etiqueta
meta
. - Copie los hash proporcionados por el explorador en los orígenes
script-src
. Inserte cada hash entre comillas simples.
Para obtener una matriz de compatibilidad de exploradores de nivel 2 de directiva de seguridad de contenido, vea ¿Puedo usar una directiva de seguridad de contenido de nivel 2?
Aplicación de la directiva
Use una etiqueta <meta>
para aplicar la directiva:
- Establezca el valor del atributo
http-equiv
enContent-Security-Policy
. - Coloque las directivas en el valor de atributo
content
. Separe las directivas con un punto y coma (;
). - Coloque siempre la etiqueta
meta
en el contenido de<head>
.
En las secciones siguientes se muestran directivas de ejemplo. Estos ejemplos pertenecen a la versión de Blazor correspondiente a este artículo. Para usar la versión adecuada en su caso, seleccione la versión del documento usando el selector desplegable Versión de esta página web.
Aplicaciones Blazor del lado servidor
En el contenido de <head>
, aplique las directivas descritas en la sección Directivas:
<meta http-equiv="Content-Security-Policy"
content="base-uri 'self';
default-src 'self';
img-src data: https:;
object-src 'none';
script-src 'self';
style-src 'self';
upgrade-insecure-requests;">
<meta http-equiv="Content-Security-Policy"
content="base-uri 'self';
default-src 'self';
img-src data: https:;
object-src 'none';
script-src https://stackpath.bootstrapcdn.com/
'self';
style-src https://stackpath.bootstrapcdn.com/
'self'
'unsafe-inline';
upgrade-insecure-requests;">
<meta http-equiv="Content-Security-Policy"
content="base-uri 'self';
default-src 'self';
img-src data: https:;
object-src 'none';
script-src https://stackpath.bootstrapcdn.com/
'self'
'sha256-34WLX60Tw3aG6hylk0plKbZZFXCuepeQ6Hu7OqRf8PI=';
style-src https://stackpath.bootstrapcdn.com/
'self'
'unsafe-inline';
upgrade-insecure-requests;">
Agregue los códigos hash script-src
y style-src
adicionales según lo requiera la aplicación. Durante el desarrollo, use una herramienta en línea o las herramientas para desarrolladores del explorador a fin de calcular los códigos hash. Por ejemplo, el siguiente error de la consola de herramientas del explorador notifica el hash de un script necesario no incluido en la directiva:
Se ha rechazado ejecutar el script en línea porque infringe la Directiva de seguridad de contenido siguiente: " ... ". Para habilitar la ejecución en línea se requiere la palabra clave "unsafe-inline", un hash ("sha256-v8v3RKRPmN4odZ1CWM5gw80QKPCCWMcpNeOmimNL2AA =") o un nonce ("nonce-...").
El script concreto asociado al error se muestra en la consola junto a dicho error.
Aplicaciones Blazor del lado cliente
En el contenido de <head>
, aplique las directivas descritas en la sección Directivas:
<meta http-equiv="Content-Security-Policy"
content="base-uri 'self';
default-src 'self';
img-src data: https:;
object-src 'none';
script-src 'self'
'wasm-unsafe-eval';
style-src 'self';
upgrade-insecure-requests;">
<meta http-equiv="Content-Security-Policy"
content="base-uri 'self';
default-src 'self';
img-src data: https:;
object-src 'none';
script-src 'self'
'unsafe-eval';
style-src 'self';
upgrade-insecure-requests;">
<meta http-equiv="Content-Security-Policy"
content="base-uri 'self';
default-src 'self';
img-src data: https:;
object-src 'none';
script-src 'self'
'sha256-v8v3RKRPmN4odZ1CWM5gw80QKPCCWMcpNeOmimNL2AA='
'unsafe-eval';
style-src 'self';
upgrade-insecure-requests;">
Nota:
El hash sha256-v8v3RKRPmN4odZ1CWM5gw80QKPCCWMcpNeOmimNL2AA=
representa el script insertado que se usa para las aplicaciones Blazor del lado cliente. Esto puede quitarse en el futuro.
<meta http-equiv="Content-Security-Policy"
content="base-uri 'self';
default-src 'self';
img-src data: https:;
object-src 'none';
script-src https://stackpath.bootstrapcdn.com/
'self'
'sha256-v8v3RKRPmN4odZ1CWM5gw80QKPCCWMcpNeOmimNL2AA='
'unsafe-eval';
style-src https://stackpath.bootstrapcdn.com/
'self'
'unsafe-inline';
upgrade-insecure-requests;">
<meta http-equiv="Content-Security-Policy"
content="base-uri 'self';
default-src 'self';
img-src data: https:;
object-src 'none';
script-src https://stackpath.bootstrapcdn.com/
'self'
'sha256-v8ZC9OgMhcnEQ/Me77/R9TlJfzOBqrMTW8e1KuqLaqc='
'sha256-If//FtbPc03afjLezvWHnC3Nbu4fDM04IIzkPaf3pH0='
'sha256-v8v3RKRPmN4odZ1CWM5gw80QKPCCWMcpNeOmimNL2AA='
'unsafe-eval';
style-src https://stackpath.bootstrapcdn.com/
'self'
'unsafe-inline';
upgrade-insecure-requests;">
Agregue los códigos hash script-src
y style-src
adicionales según lo requiera la aplicación. Durante el desarrollo, use una herramienta en línea o las herramientas para desarrolladores del explorador a fin de calcular los códigos hash. Por ejemplo, el siguiente error de la consola de herramientas del explorador notifica el hash de un script necesario no incluido en la directiva:
Se ha rechazado ejecutar el script en línea porque infringe la Directiva de seguridad de contenido siguiente: " ... ". Para habilitar la ejecución en línea se requiere la palabra clave "unsafe-inline", un hash ("sha256-v8v3RKRPmN4odZ1CWM5gw80QKPCCWMcpNeOmimNL2AA =") o un nonce ("nonce-...").
El script concreto asociado al error se muestra en la consola junto a dicho error.
Aplicación de un CSP en entornos que no son de Development
Cuando se aplica un CSP a un contenido Blazor de aplicación <head>
, interfiere con las pruebas locales en el entorno de Development
. Por ejemplo, Vínculo con exploradores y el script de actualización del explorador no se pueden cargar. En los ejemplos siguientes se muestra cómo aplicar la etiqueta <meta>
de CSP en entornos que no son de Development
.
Nota:
Los ejemplos de esta sección no muestran la etiqueta <meta>
completa para los CSP. Las etiquetas completas <meta>
se encuentran en las subsecciones de la sección Aplicar la directiva anteriormente en este artículo.
Hay tres enfoques generales disponibles:
- Aplique el CSP a través del componente
App
, que aplica el CSP a todos los diseños de la aplicación. - Si necesita aplicar CSP a diferentes áreas de la aplicación, por ejemplo, un CSP personalizado solo para las páginas de administración, aplique los CSP por diseño mediante la
<HeadContent>
etiqueta. Para lograr una eficacia completa, todos los archivos de diseño de la aplicación deben adoptar el enfoque. - El servicio de hospedaje o el servidor pueden proporcionar un CSP a través de un
Content-Security-Policy
encabezado agregado a las respuestas salientes de una aplicación. Dado que este enfoque varía según el servicio de hospedaje o el servidor, no se trata en los ejemplos siguientes. Si desea adoptar este enfoque, consulte la documentación de su proveedor de servicios de hospedaje o servidor.
Enfoques Blazor Web App
En el componente App
(Components/App.razor
), inserte IHostEnvironment:
@inject IHostEnvironment Env
En el contenidoApp
del componente <head>
, aplique el CSP cuando no esté en el entorno de Development
:
@if (!Env.IsDevelopment())
{
<meta ...>
}
Como alternativa, aplique CSP por diseño en la carpeta Components/Layout
, como se muestra en el ejemplo siguiente. Asegúrese de que cada diseño especifica un CSP.
@inject IHostEnvironment Env
@if (!Env.IsDevelopment())
{
<HeadContent>
<meta ...>
</HeadContent>
}
Blazor WebAssembly enfoques de la aplicación
En el componente App
(App.razor
), inserte IWebAssemblyHostEnvironment:
@using Microsoft.AspNetCore.Components.WebAssembly.Hosting
@inject IWebAssemblyHostEnvironment Env
En el contenidoApp
del componente <head>
, aplique el CSP cuando no esté en el entorno de Development
:
@if (!Env.IsDevelopment())
{
<HeadContent>
<meta ...>
</HeadContent>
}
Como alternativa, use el código anterior, pero aplique CSP por diseño en la carpetaLayout
. Asegúrese de que cada diseño especifica un CSP.
Limitaciones de la etiqueta meta
Una directiva de etiqueta <meta>
no admite las siguientes directivas:
Para admitir las directivas anteriores, use un encabezado denominado Content-Security-Policy
. La cadena de directiva es el valor del encabezado.
Comprobación de una directiva y recepción de informes de infracciones
Las comprobaciones ayudan a confirmar que no se han bloqueado scripts de terceros por error al crear una directiva inicial.
Para comprobar una directiva durante un período de tiempo sin aplicar directivas, establezca el atributo http-equiv
de la etiqueta <meta>
o el nombre de encabezado de una directiva basada en encabezado en Content-Security-Policy-Report-Only
. Los informes de errores se envían como documentos JSON a la dirección URL que se especifique. Para obtener más información, vea Documentación web de MDN: Content-Security-Policy-Report-Only.
Para obtener informes de infracciones mientras una directiva está activa, vea los siguientes artículos:
Aunque ya no se recomienda el uso de report-uri
, ambas directivas deben usarse hasta que todos los exploradores principales admitan report-to
. No use report-uri
única y exclusivamente, ya que la compatibilidad con report-uri
tiene visos de eliminarse de los exploradores en cualquier momento. Quite la compatibilidad con report-uri
de sus directivas cuando report-to
sea totalmente compatible. Para realizar un seguimiento del uso de report-to
, vea ¿Puedo usar report-to?
Compruebe y actualice la directiva de una aplicación en cada versión.
Solucionar problemas
- Aparecen errores en la consola de herramientas de desarrollo del explorador. Los exploradores proporcionan información sobre lo siguiente:
- Elementos que no cumplen la directiva
- Cómo modificar la directiva para permitir un elemento bloqueado
- Una directiva es totalmente efectiva únicamente cuando el explorador del cliente admite todas las directivas incluidas. Para obtener una matriz de compatibilidad de exploradores actuales, vea ¿Puedo usar Content-Security-Policy?