images-watermark
Version:
A simple and customizable Node.js library for adding text or image watermarks to images, supporting various styling options and configurations. `images-watermark` is a Node.js library that uses the **Sharp** library to add watermarks (text or logos) to im
141 lines (110 loc) • 8.13 kB
Markdown
# Images Watermark
`images-watermark` is a Node.js library that uses the **Sharp** library to add watermarks (text or logos) to images. The tool allows you to watermark images to protect or brand your content. You can apply text watermarks, logo watermarks, or a combination of both.
[](https://badge.fury.io/js/images-watermark)
[](https://opensource.org/licenses/MIT)
## Features
- **Text Watermark**: Add custom text as a watermark to images.
- **Image Logo Watermark**: Overlay an image logo as a watermark.
- **Combined Watermarks**: Apply both text and image watermarks on the same image.
## Installation
You can install the library using npm:
```bash
npm install images-watermark
```
#
## Watermarking an Image Using `singleImageWatermark`
This guide demonstrates how to add a watermark to an image using the `singleImageWatermark` library. This is useful for branding or protecting your images.
## Code Example
```javascript
const { singleImageWatermark } = require('images-watermark');
const path = require('path');
const imagesWatermark = async function (req, res) {
try {
const watermarkedImage = await singleImageWatermark({
// Path to the image you want to watermark
imagePath: path.join(__dirname, '../../../public/images/image.jpg'),
// Path to the watermark image (e.g., logo or watermark text)
watermarkPath: path.join(__dirname, '../../../public/images/Watermark.png'),
// Allowed referrers for cross-origin resource sharing (CORS)
allowedReferrers: ['http://localhost:3000'],
// Custom headers to mimic the request context
headers: {
host: 'localhost:3000', // Specify the host for the request
connection: 'keep-alive', // Keep the connection open for further requests
'user-agent': 'Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/131.0.0.0 Safari/537.36',
// Include the User-Agent header to emulate the client browser
},
});
// Set the response content type and send the watermarked image
res.setHeader('Content-Type', 'image/png');
return res.send(watermarkedImage);
} catch (error) {
console.error('Error generating watermarked image:', error);
res.status(500).send('An error occurred while processing the image.');
}
};
```
## Parameters
| Parameter | Type | Mandatory | Description |
|-------------------|------------|------------|-----------------------------------------------------------------------------|
| `imagePath` | `string` | **Required** | The path to the original image. |
| `headers` | `object` | **Required** | Headers for API calls, e.g., request headers. |
| `allowedReferrers`| `array` | **Required** | List of allowed domains for cross-platform access (CORS). |
| `watermarkPath` | `string` | Optional | The path to the watermark image (e.g., a logo). |
| `textWatermark` | `string` | Optional | Text to use as a watermark. |
| `appName` | `string` | Optional | The application name (for branding purposes). |
| `textColor` | `string` | Optional | Color of the watermark text, e.g., `#000000`. |
| `opacity` | `string` | Optional | Opacity of the watermark text, e.g., `0.3`. |
| `fontWeight` | `string` | Optional | Font weight of the watermark text, e.g., `800`. |
| `textLineSpacing` | `int` | Optional | Line spacing for the text watermark. |
| `fontFamily` | `string` | Optional | Font family for the text watermark, e.g., `Inter, Arial, sans-serif`. |
#
## Watermarking Multiple Images Using `multiImageWatermark`
This guide demonstrates how to add a watermark to multiple images using the `multiImageWatermark` library. This is useful for branding or protecting your images.
## Code Example
```javascript
const { multiImageWatermark } = require('images-watermark');
const path = require('path');
const imagesWatermark = async function (req, res) {
try {
const watermarkedImages = await multiImageWatermark({
// Path to the images you want to watermark
imagePaths: [path.join(__dirname, '../../../public/images/image1.jpg'), path.join(__dirname, '../../../public/images/image2.jpg')],
// Path to the watermark image (e.g., logo or watermark text)
watermarkPath: path.join(__dirname, '../../../public/images/Watermark.png'),
// Allowed referrers for cross-origin resource sharing (CORS)
allowedReferrers: ['http://localhost:3000'],
// Custom headers to mimic the request context
headers: {
host: 'localhost:3000', // Specify the host for the request
connection: 'keep-alive', // Keep the connection open for further requests
'user-agent': 'Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/131.0.0.0 Safari/537.36',
// Include the User-Agent header to emulate the client browser
},
});
return res.send(watermarkedImages);
} catch (error) {
console.error('Error generating watermarked image:', error);
res.status(500).send('An error occurred while processing the image.');
}
};
```
## Parameters
| Parameter | Type | Mandatory | Description |
|-------------------|------------|------------|-----------------------------------------------------------------------------|
| `imagePaths` | `array` | **Required** | In array, push paths to the original images. |
| `headers` | `object` | **Required** | Headers for API calls, e.g., request headers. |
| `allowedReferrers`| `array` | **Required** | List of allowed domains for cross-platform access (CORS). |
| `watermarkPath` | `string` | Optional | The path to the watermark image (e.g., a logo). |
| `textWatermark` | `string` | Optional | Text to use as a watermark. |
| `appName` | `string` | Optional | The application name (for branding purposes). |
| `textColor` | `string` | Optional | Color of the watermark text, e.g., `#000000`. |
| `opacity` | `string` | Optional | Opacity of the watermark text, e.g., `0.3`. |
| `fontWeight` | `string` | Optional | Font weight of the watermark text, e.g., `800`. |
| `textLineSpacing` | `int` | Optional | Line spacing for the text watermark. |
| `fontFamily` | `string` | Optional | Font family for the text watermark, e.g., `Inter, Arial, sans-serif`. |
## Example Usage
This implementation watermarks an image (or multiple images) with a logo or text and allows customization of the watermark's appearance. It also ensures proper CORS handling for cross-domain requests.
## 🔗 Author Details
[](https://tirth-gaudani.github.io/portfolio/)
[](https://in.linkedin.com/in/tirthgaudani)