Image CDN with Upload API and Cloud Storage

Uploadcare delivers content to your users across 240k servers. We focus on visuals and intelligently adapt them to user devices and browsers. Scaling in line with your business growth, Uploadcare suits web applications and companies of any size.

This article describes the complete file journey on Uploadcare. We’re serverless, so it all starts with uploading (or ingesting) your files.

• File Upload
• Cloud Storage
• Image Transformations
• Content Delivery Network
• Serve Content, Control Content-Disposition

File Upload

In case you want to collect user-generated content (UGC) in your application, we recommend integrating File Uploader to get your files to an Uploadcare project.

Technically, the uploader is an HTML5 widget. It’s designed to engage your user and comes with Javascript API to manage file uploads programmatically.

At a lower level, you can use the Upload API methods to upload files.

We precisely track the uploading process, so that you can check the progress in real time. This is especially useful when handling large files.

Once the upload is complete, our system generates and returns a UUID that uniquely identifies the file or file group. Then, you use UUIDs in your application routines; we store the related files in our Cloud Storage.

Cloud Storage

Every uploaded file goes to our Cloud Storage and gets cached by our CDN layers. From there, you can either copy the file to any connected AWS S3 bucket or get the original file or its processed version from CDN:

• Copying the file is about making a copy request.
• As the storage is connected to CDN, you can download the original file or its processed version using the CDN URL.

Learn more about configuring storage in our Documentation.

The next step is about adapting content, and the most common use case would be serving images.

Image Transformations

When you want to resize images, crop or otherwise edit them in your application, you can apply Image Transformations. By doing this, you also improve system performance, save user bandwidth, and gain faster page loads.

You apply Image Transformations by appending them to a CDN URL of your image. Let’s take this “Original.jpg” as an example:

We can deliver it cropped:

And then resize the cropped version:

Apply image filters or effects:

Learn more about existing Image Transformations in our Documentation.

Content Delivery Network

You can use Uploadcare as a CDN provider with pre-configured infrastructure.

No matter the assets you want to serve, upload them to Uploadcare and get an easy-to-integrate distributed infrastructure of 240k nodes across 135 countries that works out of the box.

You can further use CDN to serve, stream, render or play content.

Serve Content, Control Content-Disposition

Depending on the use case, you want users to interact with your content in different ways.

Browsers treat files depending on the Content-Disposition header, a part of the server response. With Uploadcare CDN, you can define the header explicitly by adding the inline operation to a URL.

Here’s an example based on the animated visualization of the Mandelbrot set from Wikipedia:

http://www.ucarecdn.com/:uuid/-/inline/yes/mb.gif

http://www.ucarecdn.com/:uuid/-/inline/no/mb.gif

By default, all images are served inline. The opposite works for other file types. You can override the default behavior by explicitly inlining content.