Image origin

An origin is any web server or storage which you are using for delivery or storing images. 

There is a good chance that in your current setup, you are serving images from multiple origins. For example a legacy Ngnix server for serving product images and an S3 bucket for serving marketing assets.

ImageKit allows you to add/manage multiple image origins in a single account like below:

URL-endpoint

When you signup, a default URL-endpoint is created in your ImageKit dashboard.

It looks like:

https://ik.imagekit.io/your_imagekitId

The first image origin that you add is automatically added to the list of origins accessible through this default URL endpoint. You can modify this by editing "origin sequence".

You can create a new URL endpoint and configure which origins are accessible through it.

For most of the cases, you would want one to one mapping between URL-endpoint and image origin. For example, you can use https://ik.imagekit.io/your_imagekitId to access the product images and another URL endpoint, i.e. https://ik.imagekit.io/your_imagekitId/marketing-assets  to access the marketing assets bucket.

Using custom domain (CNAME)

You can also use your custom domain (CNAME) instead of ImageKit URL endpoint, e.g. https://marketing-assets.yourdomain.com  instead of https://ik.imagekit.io/your_imagekitId/marketing-assets .

Configuring a single URL endpoint to access multiple image origins

This type of setup is very useful when you are migrating images from one source to other and don't want to use multiple URL endpoints in your application.

A single URL endpoint can be configured to fetch an image from multiple image origins. Let's understand it with an example.

Here we have configured the URL endpoint https://imagekit.io/demo to access image from three different origins (in a particular sequence)

When an image is requested at https://ik.imagekit.io/demo/abc-image.jpg , here is what happens:

  • abc-image.jpg   is looked in our internal caches and storage i.e. ImageKit Media Library. If the image is found, a response is returned otherwise:
  • Second image origin is accessed i.e. S3 bucket product images if the image is found, a response is returned otherwise:
  • Third image origin is accessed i.e. Legacy load balancer if the image is found, a response is returned otherwise a default image or 404 response is returned.


Next steps

Once setup is complete, start delivering resized and optimized images on your website.


Questions?

If you have a complicated legacy infrastructure and need help in configuration, please create a support ticket from the dashboard. If you are on a paid plan, start a conversation by clicking on the chat icon in the bottom right.

Did this answer your question?