Skip to main content

URL Structure

The PixelBin CDN URL that is used to transform or deliver assets has the following structures.

https://cdn.pixelbin.io/v2/{CLOUD_NAME}/{PATTERN}/{FILE_PATH}
https://cdn.pixelbin.io/v2/{CLOUD_NAME}/wrkr/{FILE_PATH}
https://cdn.pixelbin.io/v2/{CLOUD_NAME}/{ZONE_SLUG}/{PATTERN}/{FILE_PATH}
https://cdn.pixelbin.io/v2/{CLOUD_NAME}/{ZONE_SLUG}/wrkr/{FILE_PATH}

Each PixelBin CDN URL is a Zone URL. If a PixelBin CDN URL does not have the ZONE_SLUG parameter, that means that it is a Default Zone URL.


Parameters

{CLOUD_NAME}

Unique ID of an organization. It is created when a user creates an organization. To learn more about the organization and the associated cloud name, click here.

{PATTERN}

The pattern parameter corresponds to the transformations that need to be applied to the input file. You can apply a single transformation or a combination of transformations, add-ons and presets. Learn more.

If the original keyword is used in place of the pattern, the returned file will be the original asset without any modifications.

{FILE_PATH}

The relative path of the file from the root folder of the storage along with the extension.

{ZONE_SLUG}

Unique ID of a zone if using external storage to deliver a file.

wrkr

PixelBin CDN URLs with wrkr parameter are Zone URLs that have their URL Translation Worker set.


Optional Parameters

A user can add additional query parameters at the end of the CDN URL to customize the returned output. These are optional and not mandatory.

  • f_auto - automatic delivery of the best file option supported by the browser and available at the time of the request, based on the Accept header and other parameters, if any. Go to Format optimization to learn more about how to use it.

  • dpr - Acronym for Device Pixel Ratio. DPR is used to provide the best image resolutions possible to a user's device. It is based on the density of pixels in the viewing device. Go to Device Pixel Ratio to learn more about it.

  • preview - Use this to only view the image on the browser.

  • download - Use this to directly download the output image. It has more priority over the preview optional parameter.


CDN Response

  • A user will get a 200 response status code with the output file in the response body if no error occurs and the transformation is over if any is applied.

  • A user will get a 202 response status code with a JSON message as shown below if no error occurs but the applied transformation is still not over.

    {"message": "Your transformation request is still being processed. It will finish soon and be made available on the same URL."}

    The user can again refresh the CDN URL to check the results. If the applied transformation is complete, then the URL will return the image otherwise it will still return 202 status until the transformation is over.

  • A user will get a TransformationJobError JSON object if any occurs in the applied transformations. The JSON object will have the appropriate error message to debug the issue.


Transformation Pattern

Single Transformation

A single transformation pattern can be either a basic/ml transformation, an add-on or a preset used in a CDN URL.

Each transformation has a name, an identifier and params to configure the applied transformation.

info

For a preset, the identifier will be p and the name will be the name of the preset. A preset will have no params.

Let's take a look at the URL of this image uploaded to PixelBin: The same image is resized to a height of 200px and a width of 200px.

Notice how the pattern changes from original to t.resize(h:200,w:200) indicating that the resize transformation has been applied and the image has been resized to 200x200 pixels.

The transformation t.resize(h:200,w:200) can be separated as follows:

  • t - Identifier
  • resize - Name
  • h:200 - Param h with value 200
  • w:200 - Param w with value 200

Chained Transformations

You can perform a series of transformations sequentially on an image by combining multiple basic/ml transformations, add-ons, and presets. Some transformations are dependent on the sequence they're carried out in.

Each transformation is separated by using a tilde(~) symbol.

Let us see some examples.

Example

Imagine that we want to produce an optimized placeholder image for a thumbnail. To do that, we will first resize the image to 100x100 pixels, then blur it, and lastly convert the output to webp format.

Let us go over each step.

  1. Set the dimensions to 100px to resize the picture.

    t.resize(h:100,w:100)
  2. Apply blur using a 2 sigma value.

    t.blur(s:2)
  3. Change format to webp. The image size can be reduced while retaining visual quality by switching the format to webp.

    t.toFormat(f:webp)

These three steps are combined by PixelBin into a chain, with a tilde ~ sign separating each step.

t.resize(h:100,w:100)~t.blur(s:2)~t.toFormat(f:webp)
tip

Using presets, you can save your often-used chained transformations with a user-friendly name.

Click here to know more.


Transforming Images using URL

The following video demonstrates how to transform your images on the go using PixelBin's URL parameters.

Transform and enhance your images using our powerful AI technology. Organize your images in more efficient manner and our extensible APIs enables seamless integration with your system unleashing the power of our platform. Join the large community of users who use PixelBin to transform their image libraries and achieve excellent performance

Is this page useful?