开启cdn后webp图片加载异常(已解决)

最近折腾对象存储和cdn,经过踩了无数的坑,终于一点一点解决了问题,打开页面的时候有时候会有一些图片无法获取,显示图片报错:net::ERR_HTTP2_PROTOCOL_ERROR 200,需要多次刷新页面,图片才会出现。但是有时候刷新很多次也不会显示。在网上搜索解决办法,将解决问题的过程记录如下:

首先是查询到,说是宝塔面板的防火墙问题,尝试关闭防火墙,重启服务器,问题依旧,此项排除。

其次,怀疑证书问题,但是在宝塔面板查询网站ssL配置和腾讯云后台看到cdn域名配置的证书都是正确的,此项排除。

再次,网上介绍说是nginx的问题,说部分cdn也可能有这个问题,通过在 nginx config server 里加上proxy_max_temp_file_size 0;。但是飞牛按照介绍,添加上了这段代码,重启nginx,问题依然没有解决。

最后,查了半天资料发现没有解决的方案,飞牛只能继续研究几个图片不能正常显示的页面。在新页面打开图片地址是能正常显示,但是在页面中就不能正常显示,刷新几次后,图片偶尔能显示出来。飞牛尝试右键另存图片,发现了关键所在。原始图片是jpg格式,另存图片的时候,显示的是webp格式。开启cdn后webp图片加载异常(已解决)

问题也许就出现在webp格式上,飞牛记得在配置cdn的时候,有个图片优化,开启了webp自适应。

开启cdn后webp图片加载异常(已解决)

以上为腾讯云官方解释

飞牛到后台关闭了webp自适应,发现图片能正常显示了,测试其他网页,也能正常显示。没有net::ERR_HTTP2_PROTOCOL_ERROR 200报错。开启cdn后webp图片加载异常(已解决)

目前暂时解决,舍弃了webp的自适应功能。具体是什么原因导致,由于飞牛非专业人员,无法解释。遇到的问题不一样,解决的方法不一样,如果你遇到net::ERR_HTTP2_PROTOCOL_ERROR 200此类问题,你可以按照上面提到的逐项测试排查。

3月13日更新,直接在cdn配置里面,将jpg;png等图片格式添加到智能压缩可以解决webp自适应问题。

© 文章系本站作者 飞牛 原创发布于「飞牛士 FeiNews」,文章授权后方可转载,请勿侵权!

(0)

猜你喜欢

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注

评论列表(7条)

  • 林羽凡
    林羽凡 2021-03-12 12:02

    要用腾讯云cdn图片webp,你的图片满足它提到5个格式,并且头部包含 image/webp,就自动对图片进行转码了,也就是返回Webp处理后的webp图片,这也就是为啥你另存图片显示webp的原因了。这类处理过的图片加载速度快,cdn也是为了节省带宽。最后,开启webp没成功加载图片,你确定页面没问题后,问下他们客服,问题可能就出在他们那。

    • 飞牛
      飞牛 2021-03-12 12:49

      @林羽凡已经反复测试了很多次了,图片格式是满足的,头部也包含了。也有可能和页面加载缓存有关,特别是图片比加载失败的情况。

    • 林羽凡
      林羽凡 2021-03-12 22:19

      @飞牛那就基本能确定是他们的问题了,提交个工单看看啥情况。

    • 飞牛
      飞牛 2021-03-12 22:44

      @林羽凡就怕提交工单,技术那边遇不到情况,不好分析。

    • 林羽凡
      林羽凡 2021-03-12 22:45

      @飞牛你要给他们一个提高自我价值的机会,哈哈哈哈,真正的工程师是很喜欢研究新问题的。

  • 夏目贵志
    夏目贵志 2021-03-08 14:30

    不知道跟缓存有没有关系,我使用纯静态博客的时候就没有这个问题,搬回typecho 使用nginx+php 就碰到过。后面图片还是存放本地,这个问题就没了。

    • 飞牛
      飞牛 2021-03-08 17:16

      @夏目贵志缓存我刚才测试了一下,本地缓存没有联系。那么只能是cdn的缓存问题了,目前还没找到具体办法。