Updated on 2024-08-09 GMT+08:00

Using the Image Style

You can use existing image styles in a bucket in either of the following ways:

  • Copying a link (see Copying a Link): On an image's details page of OBS Console, you can copy a link for accessing the image with a style applied on the Preview Image tab page. By pasting the copied link in a browser, you can get the new image.
  • Editing a domain name: You can edit a domain name by referring to the format given below and open it in a browser to have the image with the style applied.
    <Image link>?x-image-process=style/<Style name>

    Image link can be obtained from the image details page. For details, see Editing a Domain Name. Style name is the one defined when the style was created. A style name can contain only uppercase or lowercase letters, digits, periods (.), underscores (_), and hyphens (-) and is 1 to 256 characters long, for example, rotate_0001.

Copying a Link

  1. On the console homepage, click Service List in the upper left corner and choose Storage > Object Storage Service.
  2. Click the name of the bucket that houses desired styles to go to the Objects page.
  3. Click the name of an existing image or of a newly uploaded image to go to its details page.
  4. Click the Preview Image tab to preview the image effect in one or more styles, as shown in Figure 1.

    Figure 1 Preview Image

  5. Click Copy Link in the style card you want. If Copied successfully. is prompted, you have got the link for accessing the image with the style applied.

Editing a Domain Name

  1. On the OBS object list page, click an image to be processed to go to its details page.
  2. Choose Object ACL > Public AccessUser Access > Anonymous User and click Edit. In the displayed dialog box, grant the object read permission to anonymous users and click SaveOK. For details, see Figure 2.

    Figure 2 Granting the object read permission to anonymous users

  3. Click the icon next to Link to copy the image link.
  4. Add ?x-image-process=style/<Style name> to the end of the copied link and open the new link in a browser. Then, you can access the image with the style applied.

    Link example:

    https://bucketname.obs.ap-southeast-1.myhuaweicloud.com/example.jpg?x-image-process=style/stylename

    The links and style names above are for reference only. Change them accordingly in practice.