Webp图像未通过ASP.NET MVC在Google Chrome上显示

Question

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

我尝试了dejanstojanovic的解决方案（虽然我确实了解它正在检查浏览器是否与webp兼容，然后再发送webp版本，但我并没有完全了解其中发生的情况。否则它发送了png或jpeg版本），但是没有用。同样，我尝试了deanhume的解决方案，但同样也没有用。这两个代码都返回了一个webp文件，Chrome应该支持该文件，但是页面上的图像损坏了。通过将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>

views文件夹中的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

Answer 1

我知道了。有两个Web.config文件。一个位于项目根文件夹中，另一个位于views文件夹中。我必须添加：

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

进入位于根文件夹中的web.config文件，而不是像我以前所做的那样位于views文件夹中的文件。