Webp 图像在本地显示，但在部署后不显示在远程

Question

我有这个 html 代码，当我在本地打开我的 html 文件时，我可以看到 webp 图像。

<picture>
      <source srcset="images/steve.webp" type="image/webp">
      <source srcset="images/steve.png" type="image/png">
      <img src="images/steve.png" alt="Steve" width="200" height="180">
</picture>

但是在我将其部署到我的网站后，图像没有显示。

当我直接访问图像时，出现错误。 http://resume.findingsteve.net/images/steve.webp

但是图像在那里：

http://resume.findingsteve.net/images/steve.png 没问题。我可以看到它的图像。

相对路径，还是一样的问题

Answer 1

在您的服务器网络配置中为 png 文件扩展名添加 MIME 类型

<system.webServer>
    <staticContent>
      <mimeMap fileExtension=".png" mimeType="image/png" />
   
    </staticContent>
    ...
</system.webServer>

Webp 图像在本地显示，但在部署后不显示在远程

Webp image shows up locally but not remotely after deploy

html

webp