预加载 html 中的图像会发出警告消息
使用预加载要在页面中使用的图像link preload
<link rel="preload" href="http://shmdhussain.github.io/WebTest/test_img/blue.png" crossorigin="anonymous" as="image">
但在浏览器中收到警告
找到“ https://shmdhussain.github.io/WebTest/test_img/blue.png ”的预加载，但未使用，因为请求凭据模式不匹配。考虑查看跨域属性。
我希望它能工作，但我看到同一资源（图像）有两次下载
请参阅此演示https://hussain-test.glitch.me/，打开控制台查看警告，提前感谢您的帮助。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0" />
<title>HTML BolierPlate</title>
<link rel="preload" href="https://shmdhussain.github.io/WebTest/test_img/blue.png" crossorigin="anonymous" as="image">
<style>
.font32 {
font-size: 32px
}
</style>
</head>
<body>
Welcome to BoilerPlate!!!
<p>
<img src="https://shmdhussain.github.io/WebTest/test_img/blue.png">
</p>
</body>
</html>
DIEA浏览 101回答 1
1回答
-
侃侃无极
预加载图像时无需使用跨域！镜像不需要CORS只需删除跨域即可使用 crossorigin，您将看到一次失败的预加载和一次成功的加载
随时随地看视频慕课网APP
相关分类
Html5
