Fenómeno:
La lista de imágenes de desarrollo local, acceso a imágenes 403, no se puede mostrar
error 403 de solicitud de imagen de fondo CSS
la solicitud de img es normal
razón:
403 es un error para evitar enlaces activos (este diseño es para que los fabricantes de API garanticen que sus servidores no se inunden con tráfico)
resolver:
Método 1: utilice
la solución sin referencias no solo para evitar la vinculación directa de imágenes, sino también a otras etiquetas.
1. Agregue un meta en el encabezado
<meta nombre="referrer" content="sin-referrer" />
Establecer referente:
1) Agregue el atributo de referencia usando la metaetiqueta en el área del encabezado <head> de la página html
<meta nombre="referrer" content="sin-referrer" />
2) Los proyectos de Vue2 se pueden escribir directamente en la etiqueta "plantilla" de la página
2. Agregue atributos a las etiquetas correspondientes.
Varios estados del referente
<!-- referente de una etiqueta -->
<a href="http://example.com" referrer="no-referrer|origin|unsafe-url">xxx</a>
<!-- img/image标签的referrer -->
<img referrer="no-referrer|origin|unsafe-url" src="{ {
item.src}}"/>
<image referrer="no-referrer| origen|url-insegura" src="{
{item.src}}"></image>
<!-- referente de la etiqueta del elemento -->
<el-image
style="ancho: 100px; alto: 100px"
:src="url"
:preview-src-list="srcList"
:initial-index="4"
:referrer-policy='no-referrer'
ajuste ="portada"
/>
Verificar elemento sitio web oficial el-image tiene un atributo
política de referencia: 'sin referencia'