Security News
pnpm 10.0.0 Blocks Lifecycle Scripts by Default
pnpm 10 blocks lifecycle scripts by default to improve security, addressing supply chain attack risks but sparking debate over compatibility and workflow changes.
cloudinary
Advanced tools
The Cloudinary npm package provides a comprehensive suite of tools for managing and manipulating media assets in the cloud. It allows developers to upload, transform, optimize, and deliver images and videos efficiently.
Upload
This feature allows you to upload images and videos to Cloudinary. The code sample demonstrates how to configure the Cloudinary client and upload an image.
const cloudinary = require('cloudinary').v2;
cloudinary.config({
cloud_name: 'your_cloud_name',
api_key: 'your_api_key',
api_secret: 'your_api_secret'
});
cloudinary.uploader.upload('path/to/your/image.jpg', function(error, result) {
console.log(result, error);
});
Transformation
This feature allows you to transform images and videos, such as resizing, cropping, and applying effects. The code sample demonstrates how to generate a URL for a transformed image.
const cloudinary = require('cloudinary').v2;
cloudinary.config({
cloud_name: 'your_cloud_name',
api_key: 'your_api_key',
api_secret: 'your_api_secret'
});
const url = cloudinary.url('sample.jpg', { width: 300, height: 300, crop: 'fill' });
console.log(url);
Optimization
This feature allows you to optimize images and videos for faster loading times and better performance. The code sample demonstrates how to generate a URL for an optimized image.
const cloudinary = require('cloudinary').v2;
cloudinary.config({
cloud_name: 'your_cloud_name',
api_key: 'your_api_key',
api_secret: 'your_api_secret'
});
const url = cloudinary.url('sample.jpg', { quality: 'auto', fetch_format: 'auto' });
console.log(url);
Delivery
This feature allows you to deliver images and videos via a CDN. The code sample demonstrates how to generate a URL for delivering an image.
const cloudinary = require('cloudinary').v2;
cloudinary.config({
cloud_name: 'your_cloud_name',
api_key: 'your_api_key',
api_secret: 'your_api_secret'
});
const url = cloudinary.url('sample.jpg');
console.log(url);
Imgix is a service that provides real-time image processing and optimization. It offers similar functionalities to Cloudinary, such as image transformations, optimizations, and delivery via a CDN. However, Imgix focuses more on real-time image processing and URL-based transformations.
Filestack is a service that provides file uploading, transformation, and delivery. It offers functionalities similar to Cloudinary, including file uploads, transformations, and optimizations. Filestack also provides additional features like file picking and storage integration.
ImageKit is a service that provides real-time image optimization, transformation, and delivery. It offers similar functionalities to Cloudinary, such as image transformations, optimizations, and delivery via a CDN. ImageKit also focuses on real-time image processing and URL-based transformations.
Cloudinary is a cloud service that offers a solution to a web application's entire image management pipeline.
Easily upload images to the cloud. Automatically perform smart image resizing, cropping and conversion without installing any complex software. Integrate Facebook or Twitter profile image extraction in a snap, in any dimension and style to match your website’s graphics requirements. Images are seamlessly delivered through a fast CDN, and much much more.
Cloudinary offers comprehensive APIs and administration capabilities and is easy to integrate with any web application, existing or new.
Cloudinary provides URL and HTTP based APIs that can be easily integrated with any Web development framework.
For Node.js, Cloudinary provides an extension for simplifying the integration even further.
Take a look at our Getting started guide for Node.js.
npm install cloudinary
Sign up for a free account so you can try out image transformations and seamless image delivery through CDN.
Note: Replace demo
in all the following examples with your Cloudinary's cloud name
.
Accessing an uploaded image with the sample
public ID through a CDN:
http://res.cloudinary.com/demo/image/upload/sample.jpg
Generating a 150x100 version of the sample
image and downloading it through a CDN:
http://res.cloudinary.com/demo/image/upload/w_150,h_100,c_fill/sample.jpg
Converting to a 150x100 PNG with rounded corners of 20 pixels:
http://res.cloudinary.com/demo/image/upload/w_150,h_100,c_fill,r_20/sample.png
For plenty more transformation options, see our image transformations documentation.
Generating a 120x90 thumbnail based on automatic face detection of the Facebook profile picture of Bill Clinton:
http://res.cloudinary.com/demo/image/facebook/c_thumb,g_face,h_90,w_120/billclinton.jpg
For more details, see our documentation for embedding Facebook and Twitter profile pictures.
Each request for building a URL of a remote cloud resource must have the cloud_name
parameter set.
Each request to our secure APIs (e.g., image uploads, eager sprite generation) must have the api_key
and api_secret
parameters set. See API, URLs and access identifiers for more details.
Setting the cloud_name
, api_key
and api_secret
parameters can be done either directly in each call to a Cloudinary method, by calling the cloudinary.config(), or by using the CLOUDINARY_URL environment variable.
Any image uploaded to Cloudinary can be transformed and embedded using powerful view helper methods:
The following example generates the url for accessing an uploaded sample
image while transforming it to fill a 100x150 rectangle:
cloudinary.url("sample.jpg", {width: 100, height: 150, crop: "fill"})
Another example, emedding a smaller version of an uploaded image while generating a 90x90 face detection based thumbnail:
cloudinary.url("woman.jpg", {width: 90, height: 90, crop: "thumb", gravity: "face"})
You can provide either a Facebook name or a numeric ID of a Facebook profile or a fan page.
Embedding a Facebook profile to match your graphic design is very simple:
cloudinary.url("billclinton.jpg", {width: 90, height: 130, type: "facebook", crop: "fill", gravity: "north_west"})
Same goes for Twitter:
cloudinary.url("billclinton.jpg", {type: "twitter_name"})
See our documentation for more information about displaying and transforming images in Node.js.
Assuming you have your Cloudinary configuration parameters defined (cloud_name
, api_key
, api_secret
), uploading to Cloudinary is very simple.
The following example uploads a local JPG to the cloud:
var cloudinary = require('cloudinary')
cloudinary.uploader.upload("my_picture.jpg", function(result) { console.log(result) })
Below is an example of an upload's result:
{ public_id: '4srvcynxrf5j87niqcx6w',
version: 1340625837,
signature: '01234567890abcdef01234567890abcdef012345',
width: 200,
height: 200,
format: 'jpg',
resource_type: 'image',
url: 'http://res.cloudinary.com/demo/image/upload/v1340625837/4srvcynxrf5j87niqcx6w.jpg',
secure_url: 'https://res.cloudinary.com/demo/image/upload/v1340625837/4srvcynxrf5j87niqcx6w.jpg' }
The uploaded image is assigned a randomly generated public ID. The image is immediately available for download through a CDN:
cloudinary.url("abcfrmo8zul1mafopawefg.jpg")
http://res.cloudinary.com/demo/image/upload/abcfrmo8zul1mafopawefg.jpg
You can also specify your own public ID:
cloudinary.uploader.upload("http://www.example.com/image.jpg", function(result) { console.log(result) }, {public_id: 'sample_remote'})
cloudinary.url("sample_remote.jpg")
http://res.cloudinary.com/demo/image/upload/sample_remote.jpg
See our documentation for plenty more options of uploading to the cloud from your Node.js code or directly from the browser.
You can use cloudinary.upload_stream to write to the uploader as a stream:
var fs = require('fs');
var stream = cloudinary.uploader.upload_stream(function(result) { console.log(result); });
var file_reader = fs.createReadStream('my_picture.jpg', {encoding: 'binary'}).on('data', stream.write).on('end', stream.end);
Returns an html image tag pointing to Cloudinary.
Usage:
cloudinary.image("sample", {format: "png", width: 100, height: 100, crop: "fill"})
// <img src='http://res.cloudinary.com/demo/image/upload/c_fill,h_100,w_100/sample.png' height='100' width='100'/>
You can find our simple and ready-to-use samples projects, along with documentation in the samples folder. Please consult with the README file, for usage and explanations.
Additional resources are available at:
You can open an issue through GitHub.
Contact us http://cloudinary.com/contact
Stay tuned for updates, tips and tutorials: Blog, Twitter, Facebook.
Released under the MIT license.
FAQs
Cloudinary NPM for node.js integration
The npm package cloudinary receives a total of 172,144 weekly downloads. As such, cloudinary popularity was classified as popular.
We found that cloudinary demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
pnpm 10 blocks lifecycle scripts by default to improve security, addressing supply chain attack risks but sparking debate over compatibility and workflow changes.
Product
Socket now supports uv.lock files to ensure consistent, secure dependency resolution for Python projects and enhance supply chain security.
Research
Security News
Socket researchers have discovered multiple malicious npm packages targeting Solana private keys, abusing Gmail to exfiltrate the data and drain Solana wallets.