FabricJS 从服务器端的路径加载图像?
FabricJS load image from path at server side?
如何从服务器端的文件加载图像并对其应用滤镜?我需要像下面这样的东西。接收滤镜列表、从路径加载图像、应用滤镜并将图像保存到另一个路径的函数。
const fabric = require('fabric').fabric;
const fs = require('fs');
const imageSize = require('image-size');
module.exports = {
applyFilters(filters, imagePath, outputPath) {
const out = fs.createWriteStream(outputPath);
const { width, height } = imageSize(imagePath);
const canvas = fabric.createCanvasForNode(null, { width, height });
fabric.Image.fromPath(imagePath, function(img) {
for (const filter of filters) {
img.filters.push(filter)
}
img.applyFilters();
canvas.add(img);
});
const stream = canvas.createPNGStream();
stream.on('data', function(chunk) {
out.write(chunk);
});
},
}
显然 fabric.Image.fromPath
不存在,所以我正在寻找等效的东西。图片将批量上传,并位于相对于服务器的路径中。我会使用 fromUrl
作为最后的资源,但我想避免提供原始图像。
您可以使用fabric.Image.fromURL
,但它会根据 fabricjs 版本略有不同。
在 fabric 2.x 中你可以使用文件路径...
fabric.Image.fromURL('/path/to/image.png', img => { ... });
在 fabric 3.x 中你需要使用一个文件 url
fabric.Image.fromURL('file:///path/to/image.png', img => { ... });
如何从服务器端的文件加载图像并对其应用滤镜?我需要像下面这样的东西。接收滤镜列表、从路径加载图像、应用滤镜并将图像保存到另一个路径的函数。
const fabric = require('fabric').fabric;
const fs = require('fs');
const imageSize = require('image-size');
module.exports = {
applyFilters(filters, imagePath, outputPath) {
const out = fs.createWriteStream(outputPath);
const { width, height } = imageSize(imagePath);
const canvas = fabric.createCanvasForNode(null, { width, height });
fabric.Image.fromPath(imagePath, function(img) {
for (const filter of filters) {
img.filters.push(filter)
}
img.applyFilters();
canvas.add(img);
});
const stream = canvas.createPNGStream();
stream.on('data', function(chunk) {
out.write(chunk);
});
},
}
显然 fabric.Image.fromPath
不存在,所以我正在寻找等效的东西。图片将批量上传,并位于相对于服务器的路径中。我会使用 fromUrl
作为最后的资源,但我想避免提供原始图像。
您可以使用fabric.Image.fromURL
,但它会根据 fabricjs 版本略有不同。
在 fabric 2.x 中你可以使用文件路径...
fabric.Image.fromURL('/path/to/image.png', img => { ... });
在 fabric 3.x 中你需要使用一个文件 url
fabric.Image.fromURL('file:///path/to/image.png', img => { ... });