Puede estar malinterpretando la vulnerabilidad. Puede leer más sobre esto aquí: https://www.jitbit.com/alexblog/256-targetblank---the-most-underestimated-vulnerability-ever/

Esencialmente, agregar rel="noopener noreferrer" a los enlaces protege a los usuarios de su sitio de que el sitio al que ha vinculado pueda secuestrar el navegador (a través de JS falso).

Está preguntando sobre la eliminación de ese atributo a través de las Herramientas para desarrolladores; eso solo lo expondría a usted (la persona que manipula el atributo) a la vulnerabilidad.

Actualización a partir de 2021: todas las versiones actuales de los principales navegadores ahora usan automáticamente el comportamiento de rel="noopener" para cualquier enlace target="_blank" , anulando este problema. Vea más en chromestatus.com .

Los enlaces con target="_blank" en ellos son vulnerables a que la página de referencia se intercambie en segundo plano mientras la atención del usuario se desvía por la pestaña recién abierta. Esto se conoce como tabnapping inverso :

La página de referencia se almacena en window.opener , y un sitio malicioso podría modificar esto a través de:

 if (window.opener) { window.opener.location = "https://phish.example.com"; }

Agregar rel="noopener noreferrer" corrige esta vulnerabilidad en todos los principales navegadores.

Tenga en cuenta que, en teoría, podría eliminar el lado del cliente rel mediante la manipulación ... pero ¿por qué querría hacerlo? Todo lo que estás haciendo es volverte deliberadamente vulnerable al ataque.

Otros usuarios que visitan el mismo sitio web (y no modifican su propio código del lado del cliente) aún estarían seguros, ya que el servidor aún serviría el rel="noopener noreferrer" . Su eliminación solo se aplica a usted.

Los atributos de la etiqueta de anclaje rel=”noopener” o rel=”noreferrer” mejoran la seguridad del sitio web, pero algunas personas quieren ignorarlos porque creen que afectarán la optimización del motor de búsqueda de su sitio web, pero eso es solo un mito. Protege la confidencialidad de la audiencia de su sitio web y evita que un sitio web externo propague código malicioso.

Si la consola del desarrollador muestra una advertencia sobre noopener noreferrer , asegúrese de agregar noopener y noreferrer en rel. enlace debe ser algo como a continuación:

 <a href="www.google.com" target="_blank" rel="noopener noreferrer" />

Con respecto al informe de auditorías Lighthouse Best Practices :

Agregue rel="noopener" o rel="noreferrer" a cualquier enlace externo para mejorar el rendimiento y evitar vulnerabilidades de seguridad.

En general, cuando usa target="_blank" , siempre agregue rel="noopener" o rel="noreferrer" :

Por ejemplo:

 <a href="https://www.kaiostech.com/store/" target="_blank" rel="noreferrer"> KaiStore </a>

• rel="noopener" evita que la nueva página pueda acceder a la propiedad window.opener y garantiza que se ejecute en un proceso separado.
• rel="noreferrer" tiene el mismo efecto pero también evita que el encabezado de Referer se envíe a la nueva página.

Consulte el documento oficial para obtener más información.

No hay una respuesta que señale un caso en el que realmente desee pasar la referencia simplemente ignorando cualquier advertencia de "riesgo de seguridad": por ejemplo, cuando está vinculando su propio sitio web externo , que está controlado por usted/su organización y que presumiblemente no tiene descripción vulnerabilidades de seguridad.

Por ejemplo, en mi caso, quiero ver en Google Analytics cuántos de mis visitantes leen documentos haciendo clic en enlaces dentro de la aplicación web (que usa un dominio separado de donde están los documentos) y cuántos provienen de motores de búsqueda y, por lo tanto, Quiero utilizar el encabezado de referencia para distinguir estos grupos de usuarios.

Así es como puede hacerlo al vincular sitios web como sus propios documentos que son seguros con seguridad:

 {/* Safe link to the own website *//* eslint-disable-next-line react/jsx-no-target-blank */} <a href="https://my-own-website.com" target="_blank"> Learn more </a>

En React, creé un componente común contenedor para evitar poner eslint-disable en todas partes del código (lo opuesto al componente UnsafeExternalLink ):

 import React, { ReactNode } from 'react'; /* eslint-disable react/jsx-no-target-blank */ /** * Safe link to own external websites only. */ const SafeExternalLink = ({ href, children, }: { href: string; children: ReactNode; }) => ( <a href={href} target="_blank"> {children} </a> ); export default SafeExternalLink;

Corrección de navegadores

Todos los principales navegadores han solucionado este problema al actualizar el comportamiento predeterminado para que sea seguro sin tener que especificar la propiedad rel . Lea más en Acerca de rel=noopener .

• Chrome lo arregló en v88
• ¡ Safari lo arregló en 2016!
• Firefox lo arregló en v52
• New Edge está basado en Chromium, por lo que también se corrigió