Dynamic Route for CDN (DCDN) allows you to use image editing to edit and distribute images on edge nodes. This relieves pressure on origin servers, reduces the number of requests that are redirected to origin servers, and reduces the amount of network traffic generated during the back-to-origin process. You can use image editing to perform operations such as adding watermarks to images, resizing images, and cropping images based on your business requirements. The image editing feature of Alibaba Cloud CDN, DCDN, and Object Storage Service (OSS) are independent of each other and cannot be used together.

Note
  • Before you use image editing, you must submit a ticket to activate this feature.
  • Image editing is a paid service. It is currently free of charge until further notice.

Scenarios

You must add a domain name to DCDN before you can enable image editing. The image editing feature allows you to edit and cache images on DCDN nodes. This reduces the loads on origin servers.

The following table describes some of the applicable scenarios.
Scenario Feature
E-commerce platforms
  • Efficiently edits different styles of image to be displayed on different terminals.
  • Compresses images and their comments, changes image quality, and reduces data transfer.
  • Adds watermarks to images to protect your copyright and promote your brand.
Social media
  • Edits images to be posted on social media based on user requirements.
  • Adds watermarks to images to protect digital assets.
Online education
  • Edits images to be used in online education materials based on user requirements.
  • Allows you to choose the type of compression that you want to enable based on business requirements. This helps you balance compression with image quality.
Websites that provide design resources
  • Efficiently edits different styles of image to be displayed on different terminals.
  • Allows you to compress images without compromising the image quality to accelerate image delivery. This allows websites to provide high-definition images.

Benefits

  • Accelerated delivery

    After a base image is cached on CDN nodes, the CDN nodes directly resize the image based on requests and return resized images to clients. This improves delivery efficiency.

  • Reduced loads on origin servers

    If images are edited and stored on origin servers, the images consume a lot of storage and compute resources on the origin servers. These increase the maintenance costs of your origin servers. The image editing feature allows you to edit and cache images on DCDN nodes. This reduces the loads on origin servers.

  • Improved refresh and prefetch efficiency

    After a base image expires, all images edited based on the base image are expired and become unavailable. To address this issue, images are edited and cached on CDN nodes. This solution reduces the frequency of refresh and prefetch tasks and the amount of bandwidth resources consumed by requests that are redirected to origin servers. Newly edited mages are cached on CDN nodes to ensure the availability of base images and edited images.

  • Image editing on CDN nodes

    This feature can recognize image editing parameters and edit images to adapt to different browsers and clients. It helps you meet the requirements of different users.

Limits

When you use image editing, take note of the following limits:
  • Limits on base images
    • Only the following image formats are supported: JPEG, PNG, WebP, BMP, GIF, TIFF, and JPEG 2000.
    • The size of a base image cannot exceed 10 MB.
    • The total pixels of a base image cannot exceed 16,777,216 pixels.
  • Limits on edited images
    • The total pixels of an edited image cannot exceed 16,777,216 pixels.
    • If you want to convert an edited image to the WebP format, the total pixels of the image cannot exceed 16,777,216 pixels. The width or height cannot exceed 16,384 pixels.

Configure image editing

Usage notes

DCDN allows you to edit images on edge nodes. You can set parameters to specify how you want to edit images. You must pass one or more actions such as crop or rotate to the image_process object to specify how you want to edit images. Separate multiple actions with forward slashes (/). DCDN edits images in order of actions. For example, image_process=resize,w_200/rotate,90 specifies that the image is resized to a width of 200 pixels first, and rotates 90°.

  • Format: image_process=action1,param_value1/action2,param_value2.
  • Example: image_process=resize,l_200/quality,q_90/format,webp.

Add parameters to the URL of an image

You can add image editing parameters to the end of the URL of an image.
  • Format: http://example.com/example.jpg?image_process=action,param_value
    • example.com: the domain name accelerated by DCDN.
    • example.jpg: the name of the image.
    • image_process: the object to which you can pass image editing parameters.
    • action,param_value: the action, parameter, and value that specify how the image is to be edited. For more information, see Actions.
  • Example: http://example.com/example.jpg?image_process=resize,w_200/rotate,90

Actions

You can specify one or more actions to perform on an image. The following table describes the actions that you can perform on images cached on DCDN nodes.

Feature Action Description
Convert image formats format Converts images to different formats.
Adjust image quality quality Adjusts the quality of images.
Crop images crop Crops images.
Resize images resize Resizes images.
Rotate images
  • auto-orient: automatically rotates an image.
  • rotate: manually rotates an image.
auto-orient rotates images based on the orientation property. rotate rotates images clockwise based on the angle that you specify.
Change the color of an image
  • bright: specifies the brightness of images.
  • contrast: specifies the contrast of images.
  • sharpen: specifies the sharpness of images.
Adjusts the brightness, contrast, and sharpness of images.
Manage image watermarks watermark Adds picture or text watermarks to images.
Query image information info Queries image information, including the width, height, format, and quality.