帖子中的 GIF 在本地下载后暂停播放

你好,

我在 Discourse 帖子中嵌入自定义 GIF(使用 ScreenToGif 制作)时遇到了问题。当嵌入 GIF 时,它只能显示一瞬间,然后就会冻结在第一帧,例如:

在帖子预览中它看起来是正常的。而且当我在新标签页中打开上传的 GIF 时,它也能正常播放。它只在 Discourse 本身中冻结。

我尝试了四种变通方法:

  1. 将 GIF 上传到另一个网站(例如 S3 存储桶),然后链接到它。这可以工作,直到系统机器人将其下载到本地,之后它又会冻结。

  2. 我还认为这可能与调整大小有关,所以我尝试去掉了图片的 Markdown 格式,例如:

    ![](upload://4IHl8zz0sJiYl5Vm3H21YTEFo9z.gif) 
    

    而不是:

    ![example|690x383](upload://4IHl8zz0sJiYl5Vm3H21YTEFo9z.gif) 
    
  3. 既然 GIF 在我点击链接到新标签页时能正常工作,我尝试将简写的“upload”URI 替换为上传图片的完整 URL,例如:

    ![example|690x383](https://d11a6trkgmumsb.cloudfront.net/original/3X/2/1/211635b9ae2b0960e8e135299b3a91189b00c289.gif)
    
  4. 最后,我认为问题可能与 Discourse 对 Markdown 代码的解析有关,所以我尝试使用带有上传图片完整 URL 的原始 HTML 图片标签:

    <img src="https://d11a6trkgmumsb.cloudfront.net/original/3X/2/1/211635b9ae2b0960e8e135299b3a91189b00c289.gif">
    

可惜,以上方法都没有奏效。如果我能控制我想发帖的论坛,我知道我可以禁用本地下载。但遗憾的是,我无法做到这一点!

既然这里能正常工作,但在您的网站上不行,建议您重建网站后重试。我们最近对 GIF 进行了大量修改。在某些时间段内,我们遇到过类似您报告的错误,您的网站可能处于受影响的版本中。

我觉得那不是问题所在。对我来说,这里无法正常工作,我只能看到第一帧。

是否有可能是其他 Chrome 默认设置造成了干扰?

哦,我在 Chrome 上也能复现这个问题。真奇怪。

原始版本

通过 Gifscicle 优化后
weird_optimized

经过 Gifscicle 处理后就能正常播放了:

感谢复现。您运行了哪个 gifcicle 命令来进行优化?

很简单:

gifscicle original.gif -o fixed.gif

顺便提一下,Discourse 内置了对自动播放的 MP4 和 WEBP 格式的支持,这可能会带来更好的效果!

我不认为这是文件大小问题,因为我试过更大和更小的 GIF 文件,但都没有成功。

太好了,让我看看这是否适用于我实际的 GIF 文件。完成后我会更新。

这肯定不是文件大小问题,而是一个“格式错误”的文件,gifscicle 正在修复它。某些工具生成错误文件的情况很常见。我总是在分享 GIF 之前,先通过 ffmpeg 这样的优质工具进行处理。但即便如此,如果尺寸是奇数等情况下,仍很容易得到格式错误的文件。

GIF 是一种复杂的格式,如今对于大多数应用场景,MP4 和 WEBP 是更好的选择。

所有 GIF 都已正常工作。在某些情况下,我还必须添加 --colors 256 标志。

如果有人好奇,我最初有问题的 GIF 是使用 ScreenToGif 的“神经网络”GIF 生成器生成的。

感谢你的帮助 @Falco

@nbianca 有没有人知道为什么 GIF 的缩略图没有动画效果?看起来原始 GIF 完全在限制范围内。

它在 Firefox 上可以正常播放动画。这可能是 GIF 文件格式错误,或是 Chrome 的 bug。

在最新的 Firefox / Windows 10 上,它对我来说没有动画效果。

有意思!这是我这边在 Linux 上的显示效果:左侧是 Firefox,右侧是 Chrome:

此主题中的所有 GIF 对我来说都是动态的(在 Arch Linux 上的 Chrome 浏览器中),但当前版本的 FastImage 由于 此错误 而认为它们不是动态的。

那样的话,我们应该尽快推动合并:+1:

仅供参考,我发现 gifsicle 在某些情况下无法正常工作。具体来说,有时必须使用 --colors 256 选项才能生成有效的 GIF,但其他时候又必须省略该选项。

您好,

您问题的修复方案已被采纳,现已在最新版本中可用。