Fenômeno:
Lista de imagens de desenvolvimento local, acesso à imagem 403, não pode ser exibida
erro de solicitação de imagem de fundo css 403
solicitação img é normal
razão:
403 é um erro para evitar hot links (esse design é para os fabricantes de API garantirem que seus servidores não sejam inundados com tráfego)
resolver:
Método 1: Use
a solução sem referência não apenas para evitar hotlinking de imagens, mas também para outras tags.
1. Adicione uma meta no cabeçalho
<meta name="referrer" content="no-referrer" />
Definir referenciador:
1) Adicione o atributo referenciador usando a meta tag na área de cabeçalho <head> da página html
<meta name="referrer" content="no-referrer" />
2) O projeto Vue2 pode ser escrito diretamente na tag “template” da página
2. Adicione atributos às tags correspondentes
Vários status do referenciador
<!-- referenciador de uma tag -->
<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 referer="no-referrer| origem|url inseguro" src="{
{item.src}}"></image>
<!-- referenciador da tag do elemento -->
<el-image
style="largura: 100px; altura: 100px"
:src="url"
:preview-src-list="srcList"
:initial-index="4"
:referrer-policy='no-referrer'
fit ="capa"
/>
Verifique o elemento do site oficial el-image tem um atributo
política de referenciador:'no-referrer'