使用Node.js(和NPM包'psd')parsingAdobe PSD文件,以编程方式replace图像层,然后保存/呈现为PNG

对于一个项目,我需要parsingAdobe Photoshop PSD文件 ,以编程方式查找和replace图像层,然后将其保存回PSD文件和/或导出为PNG(或JPEG)。 我没有太多的Adobe Photoshop经验,但我认为这些types的图层被称为“智能图层”。

用例:

呈现样机预览图像

  • 用户将图像上传到节点HTTP服务器
  • 用PSD上传的图片replace图层(图片填充图层)
  • 呈现为PNG / JPEG并写入HTTP响应

对于模型模板,replace层在x和y上是3d倾斜的。 我已经包含一个图像来说明这是什么意思。 将来会创build更多的模型模板,这就是为什么我认为用一个常量值来标记replace层是实现这一点的方法。

模板文件: 模板文件

上传的图片: 上传的图像

最终渲染的图像 输出图像

我不需要帮助HTTP服务器/authentication等,这部分是微不足道的。 我只是在寻找一种方法来取代图像层。

PSD文件是/将被定制为这个特定的项目。 要根据图层名称(标签)来标识要replace的图层是可接受的实现。

我已经看过几个NPM软件包来完成这项工作,但是无法获得一个正常的原型。 这个包似乎是最有前途的。

https://www.npmjs.com/package/psd

我目前有以下代码:

/* mockup.js */ var PSD = require('psd') var psd = PSD.fromFile("mockup.psd") var fs = require('fs') psd.parse() /* For easier reference */ var replacementLayer, file, fileBuffer let tree = psd.tree() let layers = tree.layer.node._children for(let layer of layers) { /* i named the layer 'replacementLayer' */ if(layer.name == 'replacementLayer') { replacementLayer = layer file = replacementLayer.layer.file fileBuffer = replacementLayer.layer.file.data } } /* replacementLayer = instanceof Layer file = instanceof File with a property 'data' (data is a buffer) fileBuffer = instanceof Buffer */ 

我尝试了各种方式打开一个图像文件,并replacePSD中的replacementLayer,但我不能得到它的工作。 仅用新的Buffer对象覆盖属性是不够的。

将图像保存为PNG非常简单

 psd.image.saveAsPng('./output.png') 

理想情况下,用于replacereplace图层的图像应该“填充”到图层的宽度和高度。

有任何想法吗?