tencent cloud

All product documents
Cloud Object Storage
DocumentationCloud Object StorageSDK DocumentationMini Program SDKImage ProcessingBasic Image Processing
Basic Image Processing
Download PDF
Last updated: 2024-02-04 17:20:26
Basic Image Processing
Last updated: 2024-02-04 17:20:26
Download PDF

Overview

This document provides an overview of APIs and SDK code samples for basic image processing.
Service
Feature
Description
Basic image processing
Proportional scaling, scaling image to target width and height
Regular cropping, cropping and scaling, cropping to circle, smart face cropping
Adaptive rotation, regular rotation
Format conversion, GIF format optimization, progressive display
Quality change for JPG and WebP images
Image blurring
Image sharpening
Watermarking
Image information acquisition
Including EXIF information
Quick image format conversion, scaling, and cropping for thumbnail generation


Processing Image During Upload

The following example shows how to automatically process an image when you upload it to COS.
When the image is uploaded successfully, COS will save both the original and the processed images. You can later obtain the processing results by using a general download request.

Sample code

<view>
  <button type="primary" bindtap="button">Process an image during upload</button>
</view>
Page({
  button: function () {
    wx.chooseMessageFile({
      count: 10,
      type: 'all',
      success: function (res) {
        var file = res.tempFiles[0];
        wxfs.readFile({
          filePath: file.path,
          success: function (res) {
            cos.putObject(
              {
                Bucket: 'examplebucket-1250000000',
                Region: 'COS_REGION',
                Key: file.name,
                Body: res.data,
                Headers: {
                  // Use the `imageMogr2` API to scale the image (by specifying the width of the output image to 200, with the height scaled proportionally).
                  'Pic-Operations':
                    '{"is_pic_info": 1, "rules": [{"fileid": "desample_photo.jpg", "rule": "imageMogr2/thumbnail/200x/"}]}',
                },
              },
              (err, data) => {
                console.log(err || data);
              },
            );
          },
          fail: (err) => console.error(err),
        });
      },
      fail: (err) => console.error(err),
    });
  },
});

Processing In-Cloud Image

The following example shows how to process an image stored in COS and save the processing result to COS.

Sample code

<view>
  <button type="primary" bindtap="button">Process an in-cloud image</button>
</view>
Page({
  button: function () {
    cos.request(
      {
        Bucket: 'examplebucket-1250000000',
        Region: 'COS_REGION',
        Key: 'exampleImage',
        Method: 'POST',
        Action: 'image_process',
        Headers: {
          // Use the `imageMogr2` API to scale the image (by specifying the width of the output image to 200, with the height scaled proportionally).
          'Pic-Operations':
            '{"is_pic_info": 1, "rules": [{"fileid": "desample_photo.jpg", "rule": "imageMogr2/thumbnail/200x/"}]}',
        },
      },
      (err, data) => {
        console.log(err || data);
      },
    );
  },
});

Processing Image During Download

The following example shows how to process an image during download.

Sample code

<view>
  <button type="primary" bindtap="button">Process an image during download</button>
</view>
Page({
  button: function () {
    cos.getObject(
      {
        Bucket: 'examplebucket-1250000000',
        Region: 'COS_REGION',
        Key: 'exampleImage',
        QueryString: `imageMogr2/thumbnail/200x/`,
      },
      (err, data) => {
        console.log(err || data);
      },
    );
  },
});

Generating Signed URL with Image Processing Parameters

Sample code

<view>
  <button type="primary" bindtap="sign">Generate a signed URL with image processing parameters</button>
  <button type="primary" bindtap="unsign">Generate an unsigned URL with image processing parameters</button>
</view>
Page({
  sign: function () {
    // Generate a signed URL (valid for 30 minutes) with image processing parameters.
    cos.getObjectUrl(
      {
        Bucket: 'examplebucket-1250000000',
        Region: 'COS_REGION',
        Key: 'exampleobject',
        Query: {
          `imageMogr2/thumbnail/200x/`: ''
        },
        Expires: 1800,
        Sign: true,
      },
      (err, data) => {
        if (data) {
          console.log(data.URL);
        }
      },
    );
  },
  unsign: function () {
    // Generate an unsigned URL with image processing parameters.
    cos.getObjectUrl(
      {
        Bucket: 'examplebucket-1250000000',
        Region: 'COS_REGION',
        Key: 'exampleobject',
        Query: {
          `imageMogr2/thumbnail/200x/`: ''
        },
        Sign: false,
      },
      (err, data) => {
        if (data) {
          console.log(data.URL);
        }
      },
    );
  },
});
Was this page helpful?
You can also Contact Sales or Submit a Ticket for help.
Yes
No

Feedback

Contact Us

Contact our sales team or business advisors to help your business.

Contact Us
Technical Support

Open a ticket if you're looking for further assistance. Our Ticket is 7x24 avaliable.

Submit a Ticket
7x24 Phone Support
Hong Kong, China
+852 800 906 020 (Toll Free)
United States
+1 844 606 0804 (Toll Free)
United Kingdom
+44 808 196 4551 (Toll Free)
Canada
+1 888 605 7930 (Toll Free)
Australia
+61 1300 986 386 (Toll Free)
EdgeOne hotline
+852 300 80699
More local hotlines coming soon