如何从浏览器剪贴板API获取动画GIF图像？ [英] how to get animated gif image from browser clipboard api?

问题描述

我正在测试下面的代码，当我复制一个动画gif并将其粘贴到网页时，我在控制台中看到 image / png - 而不是 image / gif 和预期的一样。

为什么？

  document.onpaste = function（event）{
 console.log（event.clipboardData.items [1] [ '类型']）; //'image / png'
}; 
  

如何匹配gif图片？

您可以在 jsfiddle 上用此 gif图片为例。 解决方案

p> CF_GIF剪贴板格式很少使用。大多数应用程序只能将图像复制到剪贴板，只能CF_BITMAP，CF_ENHMETAFILE或CF_DIB。然后，在粘贴时，数据将转换为目标应用程序所采用的任何格式，例如PNG或位图。
所以在你的情况下，GIF很可能作为位图复制到剪贴板，然后在粘贴时转换为PNG。你的GIF的所有动画帧都丢失了。
为了保存，您需要拖放/模拟粘贴CF_HDROP，CF_FileName等文件。

I am testing the following code, and when I copy an animated gif and paste it to web page, I see image/png in the console - instead of image/gif as expected.

Why?

document.onpaste = function(event) {
  console.log(event.clipboardData.items[1]['type']); // 'image/png'
};

How can I match a gif image?

You can test it at this jsfiddle with this gif image for example.

解决方案

The CF_GIF clipboard format is very seldomly used. Most app copy images to the clipboard only as CF_BITMAP, CF_ENHMETAFILE, or CF_DIB. Then when you paste, the data is converted to whatever format the target application perfers, such as PNG or Bitmap. So in your case, the GIF was likely copied to the clipboard as a Bitmap, then converted to PNG when pasting. All of the animation frames of your GIF were lost. In order to preserve, you need to do drag/drop or emulate file pasting with CF_HDROP, CF_FileName, etc..

这篇关于如何从浏览器剪贴板API获取动画GIF图像？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！