如何在javascript客户端将图像解析为ICO格式

Question

我想在前端使用 javascript 将图像（png/jpeg）转换为 ICO。

在网上搜索时，我在 github 上发现了这段代码：https : //gist.github.com/twolfson/7656254但不幸的是它使用fs //gist.github.com/twolfson/7656254了 nodejs 模块（+ 代码很难理解）。

有人可以告诉我应该搜索什么/或使用前端javascript将png/jpeg转换为ico的方法吗？

我尝试过的替代方法？

使用了这个 repo：https : //github.com/fiahfy/ico-convert但他们使用了sharp，并且客户端不支持sharp

Answer 1

在谷歌上，我得到了这篇 Mozilla 帖子，其中包含示例，其中提供了以下用于转换为 ICO 格式的代码（仅限于 Firefox 浏览器），

将画布转换为 ico 的方法（仅限 Mozilla）

这用于-moz-parse将画布转换为 ico。Windows XP 不支持从 PNG 转换为 ico，因此它使用 bmp 代替。通过设置下载属性来创建下载链接。下载属性的值是将用作文件名的名称。

代码：

var canvas = document.getElementById('canvas');
var d = canvas.width;
ctx = canvas.getContext('2d');
ctx.beginPath();
ctx.moveTo(d / 2, 0);
ctx.lineTo(d, d);
ctx.lineTo(0, d);
ctx.closePath();
ctx.fillStyle = 'yellow';
ctx.fill();

function blobCallback(iconName) {
  return function(b) {
    var a = document.createElement('a');
    a.textContent = 'Download';
    document.body.appendChild(a);
    a.style.display = 'block';
    a.download = iconName + '.ico';
    a.href = window.URL.createObjectURL(b);
  }
}
canvas.toBlob(blobCallback('passThisString'),
  'image/vnd.microsoft.icon', 
  '-moz-parse-options:format=bmp;bpp=32'
);

除此之外，我没有找到其他方法将 png/jpeg 转换为 ICO 格式。或者，您可以使用以下任何模块在服务器端进行转换：

• to-ico
• 图像到图标
• png 转 ico