Apply filtering effect to WEBP via NodeJs Cloud API
Apply filtering effect to WEBP using native NodeJs Cloud APIs without needing any image editor or 3rd-party libraries.
Get StartedHow to apply filtering effect to WEBP Using NodeJs Cloud API
Aspose.Imaging.Cloud for Node.js API which is a feature-rich, powerful and easy to use image manipulation and conversion Cloud API for Node.js platform. You can install its latest version from npm
npm console command
npm i @asposecloud/aspose-imaging-cloud
Steps to applying filtering effect to WEBP via NodeJs Cloud API
Developers can easily load & apply filter to WEBP files in just a few lines of code.
- Load WEBP file as stream
- Create & set the instance of FilterEffectImageRequest
- Set filter type and properties
- Call the FilterEffectImage method
- Get changed image from response stream
System Requirements
Aspose.Imaging Cloud for NodeJs is supported on all major operating systems. Just make sure that you have the following prerequisites.
- Node.js 6.x and higher.
Apply filtering effect to WEBP - Cloud
import * as fs from "fs"; | |
import * as path from "path"; | |
import {ImagingBase} from "./imaging-base"; | |
import { | |
GaussianBlurFilterProperties, FilterEffectImageRequest, | |
ImagingApi, | |
} from "@asposecloud/aspose-imaging-cloud"; | |
const ImageFileName = "example_image.webp"; | |
const ImagesFolder = "ExampleImages"; | |
const CloudFolder = "CloudImages"; | |
const OutputFolder = "Output"; | |
// Get ClientId and ClientSecret from https://dashboard.aspose.cloud/ | |
// or use on-premise version (https://docs.aspose.cloud/imaging/getting-started/how-to-run-docker-container/) | |
const api = new ImagingApi(clientSecret, clientId, "https://api.aspose.cloud"); | |
/** | |
* Applies filtering effect to an image from cloud storage. | |
*/ | |
public async FilterImageFromStorage() { | |
const localInputImage = fs.readFileSync(path.join(ImagesFolder, ImageFileName)); | |
const uploadFileRequest = new UploadFileRequest({path: path.join(CloudFolder, imageName), file: image}); | |
const result = await this.api.uploadFile(uploadFileRequest); | |
if (result.errors.length > 0) | |
console.log(`Uploading errors count: ${result.errors.length}` | |
const format = "webp"; | |
const filterType = "GaussianBlur"; | |
const filterProperties = new GaussianBlurFilterProperties({radius: 4, sigma: 2.1}); | |
const folder = this.CloudFolder; // Input file is saved at the desired folder in the storage | |
const storage = undefined; // We are using default Cloud Storage | |
const request = new FilterEffectImageRequest({ | |
name: this.ImageFileName, | |
filterType, | |
filterProperties, | |
format, | |
folder, | |
storage, | |
}); | |
const updatedImage = await this.api.filterEffectImage(request); | |
// Save the image file to output folder | |
const updatedImageName = ImageFileName.substr(0, ImageFileName.lastIndexOf(".")) + "webp"; | |
const filePath = path.resolve(path.join(OutputFolder, updatedImageName)); | |
fs.writeFile(filePath, updatedImage, (err) => { | |
if (err) { | |
throw err; | |
} | |
}); | |
} |
About Aspose.Imaging Cloud API for NodeJs
Aspose.Imaging Cloud API is an image processing solution to process images (photos) within your cloud or web applications. It offers: cross-platform Image processing, including but not limited to conversions between various image formats (including uniform multi-page or multi-frame image processing), transformations (resize, crop, flip&rotate, grayscale, adjust), advanced image manipulation features (filtering, deskewing), AI features (i.e. object detection and reverse image search). It’s a Cloud API and does not depend on any software for image operations. One can easily add high-performance image conversion features with Cloud APIs within projects. Flexible integrations options including SDKs for various languages (Python, Ruby, .NET, Java, NodeJS, PHP) and the use of the REST API allow to make the integration easy.
Apply filtering effect to WEBPs via Online App
Apply filtering effect to WEBP documents by visiting our Live Demos website. The live demo has the following benefits:
WEBP What is WEBP File Format
WebP, introduced by Google, is a modern raster web image file format that is based on lossless and lossy compression. It provides same image quality while considerably reducing the image size. Since most of the web pages use images as effective representation of data, the use of WebP images in web pages results in faster loading of web pages. As per Google, WebP lossless images are 26% smaller in size compared to PNGs, while WebP lossy images are 25-34% smaller than comparable JPEG images. Images are compared based on the Structural Similarity (SSIM) index between WebP and other image file formats. WebP is a sister project of WebM multimedia container format.
Read MoreOther Supported Filters
Using NodeJs Cloud API, one can easily apply filtering effect to different formats including: