Webp 图片未通过 ASP.NET mvc 显示在 google Chrome 上

Webp image not showing up on google Chrome via ASP.NET mvc

我一直在尝试在我的网站上使用 Webp 图片,但它们在所有浏览器上都会显示为损坏的图片。

我已经尝试了 dejanstojanovic (I didn't completely get what was happening in there, although I did understand it was checking if the browser is compatible with webp and then sending the webp version if it was else it sent a png or jpeg version) however, that didn't work. Similarly, I tried a solution from deanhume 的解决方案,但同样,它也没有用。两个代码都返回了 chrome 应该支持的 webp 文件,但是页面上有损坏的图像。我通过将 png 文件和 webp 文件放在同一文件夹中并同时显示它们来检查以确保这不是路径的错误。 png 文件完美运行,但是缺少 webp 文件。此外,如果我使用原始 HTML,webp 文件也可以工作,只是不能使用 ASP.NET.

_layout.cshtml

        <h5 class="footer-header">Contact Info</h5>
        <p class="footer-text">Contact us if you want a custom made dress, or just want to know where your package might be.</p>
        <div class="row">
            <div class="col-md-1">
                <img style="height:50px; width:50px" src="~/Images/LocationPin100h.webp" />
                <img style="height:50px; width:50px" src="~/Images/LocationPin100h.png" />
            </div>
        </div>

web.config 在视图文件夹中

<system.webServer>
    <handlers>
      <remove name="BlockViewHandler"/>
      <add name="BlockViewHandler" path="*" verb="*" preCondition="integratedMode" type="System.Web.HttpNotFoundHandler" />
      <remove name="WebPHandler" />
      <add name="WebPHandler" type="Web.Images.WebP.RequestHandler, Web.Images.WebP" path="*.webp" verb="GET" />
    </handlers>
    <staticContent>
      <mimeMap fileExtension=".webp" mimeType="image/webp" />
    </staticContent>
  </system.webServer>

它在页面上的样子: https://ibb.co/QjJkqv7

我想通了。有两个 Web.config 个文件。一个位于项目根文件夹中,一个位于 views 文件夹中。我必须添加:

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

进入位于根文件夹中的 web.config 文件,而不是像我之前那样位于 views 文件夹中的文件。