如何在 NodeJS 上使用 GraphicsMagick 提取 GIF 的第一帧并将其保存为 PNG？答案

【问题标题】：How can I extract the first frame of a GIF and save it as a PNG using GraphicsMagick on NodeJS?如何在 NodeJS 上使用 GraphicsMagick 提取 GIF 的第一帧并将其保存为 PNG？
【发布时间】：2013-06-19 16:27:13
【问题描述】：

以下是我想要执行此操作的步骤：

用户向服务器提供指向动画 gif 的链接
服务器使用“request(url)”获取文件
服务器生成 gif 第一帧的缩略图
服务器将缩略图上传到 Amazon S3

第 3 步中存在问题。我无法找到提取 gif 第一帧的方法。我更喜欢使用 GraphicsMagick，但如果您知道还有其他方法可以使用，我将不胜感激！

NodeJS 正在使用中。

【问题讨论】：

有一个适用于 Node.js 的 GraphicsMagick 包：aheckmann.github.io/gm
@GJK 是的，这就是我正在使用的。不幸的是，当我尝试将 [0] 添加到 url 的末尾时，它并没有抓取第一帧。相反，它只是以糟糕的质量保存 gif。
您需要使用什么 graphicsmagick 命令，gm 为您生成什么命令？

标签： javascript node.js graphicsmagick

【解决方案1】：

我不知道为什么这不在文档中，而是其他人answered this here on stackoverflow。

因此，您可以将其与文件路径字符串或流/缓冲区一起使用，如下所示：

对于文件：

gm('/path/to/animated.gif')
.selectFrame(0)
.write('/path/to/firstframe.png', function(err){
    if (err) print('  :(  ');
})

对于流/缓冲区：

gm(streamOrBuffer)
.selectFrame(0)
.write('/path/to/firstframe.png', function(err){
    if (err) print('  :(  ');
})

在文档中，他们说您需要将路径字符串更改为 '/path/to/animated.gif[0]' 以更具体地使用您要选择的框架，但我在没有指定框架的情况下测试了该代码，并且效果很好（使用gm@1.21.1 和 ImageMagick 6.7.7-10 2014-03-06）。此外，他们在文档中的内容（不使用 selectFrame）也不起作用。它最终崩溃并在此过程中创建了整个 gif 的几个 png 帧。

为什么他们还没有记录 selectFrame 是我无法理解的。正如他们在引用的链接中指出的那样，有一个未解决的问题wondering precisely that。

【讨论】：

【解决方案2】：

由于我无法让它在服务器端工作，我最终只是将 .gif 绘制到 <canvas> 元素以“模拟”提取 .gif 的第一帧。这给了我想要的暂停 gif。

【讨论】：