Question

我不确定粘贴代码片段并要求解释的规则在哪里，所以如果这不意味着要在这里，请让我知道，我将删除问题！

我正在一个继承的网站上工作，正在查看.htaccess文件。说实话，我真的不熟悉编写自定义.htaccess规则，所以我想知道是否有人可以向我解释此代码段中的情况？

<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteCond %{HTTP_ACCEPT} image/webp
  RewriteCond %{DOCUMENT_ROOT}/$1.webp -f
  RewriteRule (.+)\.(jpe?g|png)$ $1.webp [T=image/webp,E=accept:1]
</IfModule>

在进行了一次谷歌搜索之后，我很确定它会拍摄提供的任何图像并最后以webp而不是其原始扩展名返回吗？

我相信代码的目的是愚弄 pagespeed见解，以便它不会抱怨提供下一代图像格式。

我只是想知道是否有人可以对发生的事情以及它的工作方式进行全面的分析？

此外，我注意到，当我在站点上更改图像大小（出于优化目的）时，虽然此代码出现在htaccess中，但pagespeed不会注册更改，例如它有助于某种图像缓存？如果删除此代码段，pagespeed会检测到新的优化图像吗？

谢谢

Answer 1

我很确定它会拍摄提供的任何图像并最后以webp而不是原始扩展名返回吗？

基本上，是的。（尽管这不是“重定向”。）

更具体地说...（假设已启用mod_rewrite-由外部<IfModule mod_rewrite.c>容器检查）：

RewriteRule (.+)\.(jpe?g|png)$-对于与正则表达式(.+)\.(jpe?g|png)$匹配的每个URL路径。换句话说，任何以.jpg，.jpeg或.png结尾的URL。
RewriteCond %{HTTP_ACCEPT} image/webp-并且Accept HTTP请求标头包含字符串image/webp。换句话说，用户代理接受webp图像。
RewriteCond %{DOCUMENT_ROOT}/$1.webp -f-相应的.webp图像与请求的文件位于同一位置。例如。请求/foo/bar/baz.jpg和/foo/bar/baz.webp存在。
RewriteRule -------- $1.webp-然后将请求内部重写到.webp映像（例如foo/bar/baz.webp）。请注意，这不是“重定向”，用户代理仍会看到原始的.jpg（或.png）文件名。也...
- T=image/webp-将Content-Type标头设置为image/webp。（覆盖将要发送的image/jpeg或image/png值。）
- E=accept:1-将环境变量 accept设置为1。（然后您的应用程序可以使用它。）

我相信代码的目的是愚弄 pagespeed见解，以便它不会抱怨提供下一代图像格式。

我认为这样做的目的不一定是“ 愚蠢 pagespeed见解”。（愚弄工具需要做很多工作！）

但是，它确实允许优美的降级 ...默认情况下，.jpg会被投放，而如果用户代理支持.webp（并且确实存在），则会投放.webp。）。

此外，我注意到，当我在站点上更改图像大小（出于优化目的）时，虽然此代码出现在htaccess中，但pagespeed不会注册更改，例如它有助于某种图像缓存？如果删除此代码段，pagespeed会检测到新的优化图像吗？

您要重新生成.jpg图片吗？

此代码仅在请求.png（或.webp）图像且存在相应的.webp图像时适用。除非您也更新.webp映像（或者首先不存在），否则任何兼容的用户代理都不会看到映像中的更改。

将来...当所有人都支持RewriteCond图像时，您可以安全地删除两个.webp指令（以及相对昂贵的文件系统检查）。并将所有图像另存为.jpg（您的网站上没有.jpg个图像）。图片 URL 仍为<IfModule mod_rewrite.c>。这些指令使您无需更改URL即可升级图像。

在这种情况下，您还应该删除<IfModule>包装器，因为您的站点现在依赖于mod_rewrite执行它的工作。 var ar = document.getElementsByClassName("row")[4].getElementsByClassName("well result-box nomargin"); for (var i = 0; i < ar.length; i++) { try { var html = ar[i].getElementsByTagName("a")[2].getAttribute("href"); $.ajax({ url: html, success: function(result) { var resultHTML = $.parseHTML(result); // Here the HTML is parsed } }); } catch { console.log(i); } }包装器仅在mod_rewrite对您的网站“正常”运行是可选时使用。

代码段说明，图像以.htaccess格式提供

1 个答案: