Javascript -合并/覆盖图像

Question

我需要生成一个新的图像，覆盖两个远程图像，然后得到生成的图像的base64编码。

我发现的大多数解决方案都依赖于这样一个事实，即这些图像应该位于网站所在的服务器上：

• Merge two dataURIs to create a single image
• Merge Multiple Canvases and Download as Image

然后查看一些源，我发现有人使用下面的基本URL来覆盖两个图像：

https://i.vimeocdn.com/filter/overlaysrc=url-1&src__=url-2

示例：https://i.vimeocdn.com/filter/overlay?src=http://www.backgroundsy.com/file/large/warm-colors-background.jpg&src=https://cdn3.iconfinder.com/data/icons/3d-printing-icon-set/256/Pause.png

它似乎涉及到一些vimeo。这样做安全吗？

Answer 1

我可能会在一个与此相关的帖子上给出一个解决这个问题的策略：

https://stackoverflow.com/a/52634041/2888452

但是，我将显式地上传这两个文件，而不是选择外部位置。我不确定跨域协议将如何处理来自其他域的直接引用的图像。也许您可以使用我创建的小提琴作为起点&尝试引用外部资产吗？

干杯!