Feature Overview
CI uses the imageMogr2 API to crop images, including regular cropping, scaling and cropping, cropping to circle, rounded corner cropping, and smart face cropping.
An image can be processed:
During download
During upload
In the cloud
Restrictions
Format: Currently, JPG, BMP, GIF, PNG, and WebP images can be processed, and HEIF images can be decoded and processed.
Size: The input image cannot be larger than 32 MB, with its width and height not exceeding 30,000 pixels respectively, and the total number of pixels not exceeding 250 million. The width and height of the output image cannot exceed 9,999 pixels respectively. For an animated input image, the total number of pixels (width * height * number of frames) cannot exceed 250 million.
Frames (for animated images): For GIF images, the number of frames cannot exceed 300.
API Sample
1. Processing during download
GET /<ObjectKey>?imageMogr2/cut/<width>x<height>x<dx>x<dy>
/crop/<imageSizeAndOffsetGeometry>
/iradius/<radius>
/rradius/<radius>
/scrop/<Width>x<Height> HTTP/1.1
Host: <BucketName-APPID>.cos.<Region>.myqcloud.com
Date: <GMT Date>
Authorization: <Auth String>
Note:
Spaces and line breaks above are for readability only and can be ignored.
2. Processing during upload
PUT /<ObjectKey> HTTP/1.1
Host: <BucketName-APPID>.cos.<Region>.myqcloud.com
Date: GMT Date
Authorization: Auth String
Pic-Operations:
{
"is_pic_info": 1,
"rules": [{
"fileid": "exampleobject",
"rule": "imageMogr2/cut/<width>x<height>x<dx>x<dy>
/crop/<imageSizeAndOffsetGeometry>
/iradius/<radius>
/rradius/<radius>
/scrop/<Width>x<Height>"
}]
}
3. Processing in-cloud data
POST /<ObjectKey>?image_process HTTP/1.1
Host: <BucketName-APPID>.cos.<Region>.myqcloud.com
Date: GMT Date
Content-length: Size
Authorization: Auth String
Pic-Operations:
{
"is_pic_info": 1,
"rules": [{
"fileid": "exampleobject",
"rule": "imageMogr2/cut/<width>x<height>x<dx>x<dy>
/crop/<imageSizeAndOffsetGeometry>
/iradius/<radius>
/rradius/<radius>
/scrop/<Width>x<Height>"
}]
}
Parameters
|
| Object name, such as folder/sample.jpg. |
| If this parameter is carried and the image fails to be processed because the image is too large or a parameter value exceeds the limit, the input image will be returned with no error reported. |
Parameters for regular cropping
Operation name: cut.
|
| Width of the output image |
| Height of the output image |
| Horizontal offset relative to the top-left vertex |
| Vertical offset relative to the top-left vertex |
Note:
The values should be greater than 0 and smaller than the width/height of the input image.
Parameters for scaling and cropping
Operation name: crop.
|
| Width of the output image with the height unchanged. The value must be greater than 0 and smaller than the width of the input image. |
| Height of the output image with the width unchanged. The value must be greater than 0 and smaller than the height of the input image. |
| Width and height of the output image. The values of width and height should be greater than 0 and smaller than those of the input image, respectively. |
When performing scaling and cropping, you can also use the gravity parameter to specify the start position of the operation. For more information, see [Scaling and cropping](#Scaling and cropping).
Parameters for cropping to circle
Operation name: iradius.
|
| Crops to a circle. radius specifies the radius of the inscribed circle, which should be an integer greater than zero and less than half of the shorter side of the input image. The center of the inscribed circle is the center of the image. This operation is not supported for GIF images. |
Parameters for rounded corner cropping
Operation name: rradius.
|
| Crops with round corners. radius specifies the radius of the rounded corner of the image, which should be an integer greater than zero and less than half of the shorter side of the input image. The two sides of the image are the tangent lines of the rounded corner. This operation is not supported for GIF images. |
Parameters for smart face cropping
Operation name: scrop.
|
| Scales and crops an image based on the face position in the image. The width and height of the target image are specified by Width and Height respectively. |
3x3 Grid Position Diagram
The 3x3 grid position diagram is as follows. Once you specify the gravity parameter for an operation, the corresponding red dot becomes the reference point, and offsets will be relative to this point.
Note:
If gravity is set to center, dx and dy are invalid.
If gravity is set to north or south, dx is invalid.
If gravity is set to west or east, dy is invalid.
Samples
Note:
Processing during download is used as an example here, which does not store the output image in a bucket. If you need to store the output image, see Persistent Image Processing and use the processing during upload or processing in-cloud data feature. Sample 1: Regular cropping
This example shows how to translate by 100 px horizontally to the right and 10 px vertically to the bottom relative to the top-left vertex of the input image and then crop it according to the specified target image resolution of 600x600 px.
http://examples-1251000004.cos.ap-shanghai.myqcloud.com/sample.jpeg?imageMogr2/cut/600x600x100x10
Sample 2: Scaling and cropping
This example shows how to scale and crop an image to 300x400 px by using the center as the reference point.
http://examples-1251000004.cos.ap-shanghai.myqcloud.com/sample.jpeg?imageMogr2/crop/300x400/gravity/center
Sample 3: Cropping to circle
This example shows how to crop the input image to a circle with the radius of 200.
http://examples-1251000004.cos.ap-shanghai.myqcloud.com/sample.jpeg?imageMogr2/iradius/200
Sample 4: Rounded corner cropping
This example shows how to crop the input image to rounded corners with the radius of 100.
http://examples-1251000004.cos.ap-shanghai.myqcloud.com/sample.jpeg?imageMogr2/rradius/100
Sample 5: Smart face cropping
This example shows how to crop the input image to the specified resolution of 100x600 px based on the face position in the image.
http://examples-1251000004.cos.ap-shanghai.myqcloud.com/sample.jpeg?imageMogr2/scrop/100x600
Note:
If no face is recognized, the input image will be returned.
Sample 6: Smart face cropping with a signature carried
This example processes the image in the same way as in the example above, except that a signature is carried. The signature is concatenated with other processing parameters by an ampersand (&).
http://examples-1251000004.cos.ap-shanghai.myqcloud.com/sample.jpeg?q-sign-algorithm=<signature>&imageMogr2/scrop/100x600
Notes
To prevent unauthorized users from accessing or downloading the input image by using a URL that does not contain any processing parameter, you can add the processing parameters to the request signature, making the processing parameters the key of the parameter with the value left empty. The following is a simple sample for your reference (it might have expired or become inaccessible). For more information, see Upload via Pre-Signed URL. http://examples-1251000004.cos.ap-shanghai.myqcloud.com/sample.jpeg?q-sign-algorithm=sha1&q-ak=AKID********************&q-sign-time=1593342360;1593342720&q-key-time=1593342360;1593342720&q-header-list=&q-url-param-list=watermark%252f1%252fimage%252fahr0cdovl2v4yw1wbgvzlteyntewmdawmdqucgljc2gubxlxy2xvdwquy29tl3nodwl5aw4uanbn%252fgravity%252fsoutheast&q-signature=26a429871963375c88081ef60247c5746e834a98&watermark/1/image/aHR0cDovL2V4YW1wbGVzLTEyNTEwMDAwMDQucGljc2gubXlxY2xvdWQuY29tL3NodWl5aW4uanBn/gravity/southeast