Programmable Media

Upload programmatically (video tutorial)

Last updated: Oct-29-2024

Overview

Cloudinary's Upload API allows you to quickly upload your images, videos and other media files to Cloudinary for immediate deliverability. Let's show you how to use this API in your development environment.

Video tutorial


This video is brought to you by Cloudinary's video player - embed your own!

View the code
You can find the code from this tutorial in GitHub.

Tutorial contents

This tutorial presents the following topics. Click a timestamp to jump to that part of the video.

Supported programming languages

Jump to this spot in the video  0:11 Our tutorial uses Node.js and server-side scripts to demonstrate the upload capabilities. However, we support many popular programming languages, including Ruby, PHP, Python and more.

Write your script

Jump to this spot in the video  0:32 Start writing a script that uses Cloudinary's Upload API to get the image into your Cloudinary product environment. Our example requires two different libraries - the Cloudinary Node.js SDK and dotenv, which allows your development environment to use your Cloudinary credentials and upload the assets in an authenticated way.

Retrieve your environment variable

Jump to this spot in the video  0:50 Copy the API environment variable format from the API Keys page of the Cloudinary Console Settings. Replace <your_api_key> and <your_api_secret> with your actual values. Your cloud name is already correctly included in the format. Then, paste the environment variable into a .env file in your development project. Do not expose your Cloudinary product environment credentials in your site's frontend and public code.

Call the Upload API

Jump to this spot in the video  1:14 Call the Cloudinary Upload API, then reference the file you want to upload.

Add callback functions

Jump to this spot in the video  1:19 Add your callback functions. This tutorial uses promises to handle the successes and failures in the code.

Ensure script libraries are installed

Jump to this spot in the video  1:26 Make sure all of our script's libraries are properly installed with a simple npm i command. If you opening your package.json file, you can see all of the packages have been listed as dependencies.

Run the script and upload the local asset

Jump to this spot in the video  1:41 You should have gotten a successful JSON response with lots of data about the uploaded file, including its resolution, file size, format, and more. The file is also now an immediately deliverable asset from a secure, HTTPS URL.

Upload an asset from a public URL

Jump to this spot in the video  2:00 To upload a file from any public URL, simply enter the full URL of the asset, instead of the local file path.

Add parameters to the upload call

Jump to this spot in the video  2:19 You can edit the file's public ID, so the asset is named exactly what you want it to be. It is also possible to add tags to the asset, so you can easily find and deliver it later. You can even apply quality analysis features to provide automation, based on the blurriness or overall size of the asset.

Keep learning

Related topics

If you like this, you might also like...

Generate Upload Signature
Generate a timestamp and signature for a signed upload
Get Started with the CLI
Set up the CLI and get familiar with some basic commands
Upload with the CLI
Apply background removal to images on upload

 

Cloudinary Academy

 

Check out the Cloudinary Academy for free self-paced Cloudinary courses on a variety of developer or DAM topics, or register for formal instructor-led courses, either virtual or on-site.

 

✔️ Feedback sent!

Rate this page: