全部產品
Search
文件中心

Object Storage Service:圖片縮放

更新時間:Dec 21, 2024

對於儲存在OSS中的圖片,您可以在GetObject請求中添加圖片縮放參數,以縮小或放大圖片。

使用情境

  • 網頁設計: 在網頁設計和行動裝置 App開發中,圖片需要根據不同的螢幕尺寸和解析度自適應顯示。

  • 社交媒體: 使用者上傳的圖片尺寸各異,平台需要統一處理為適合預覽的尺寸。

  • Image Recognition和分析:在電腦視覺和機器學習領域,為了提高處理效率,對映像進行縮放。

  • 儲存和傳輸:縮小圖片尺寸可以減少儲存空間和資料轉送時間。

使用限制

限制

專案

說明

原圖限制

圖片格式

原圖只支援JPG、PNG、BMP、GIF、WebP、TIFF、HEIC。

說明
  • GIF格式的圖片只支援指定寬高縮小,不支援按百分比縮小(按百分比縮小的情況下,動態圖會變成靜態圖)。

  • GIF格式的圖片不支援放大。

圖片大小

原圖大小不能超過20 MB。如果您需要調整原圖大小限制,請在配額中心申請

圖片寬高

原圖高或者寬不能超過30,000 px,且總像素不能超過2.5億 px。

說明

動態圖片(例如GIF圖片)的總像素計算方式為寬*高*圖片幀數;非動態圖片(例如PNG圖片)的總像素計算方式為寬*高

縮放後限制

圖片縮放

縮放後圖片寬或高不能超過16,384 px,且總像素不能超過16,777,216 px。

計費說明

使用圖片處理服務時,會產生圖片處理費用、GET請求費用和流量費用。詳細計費介紹請參見計費說明

操作方式

您可以通過檔案URL、SDK、API方式設定圖片處理參數。使用檔案URL僅適用於公用訪問的圖片。如果是私人訪問的圖片,請使用SDK、API處理圖片。更多資訊,請參見圖片處理操作方式

在OSS中,當您在圖片URL末尾添加?x-oss-process=image/resize,parame_value參數時,OSS會即時處理該圖片,返回處理後的結果。image/resize表示進行縮放處理,parame為圖片縮放支援的參數,value為參數取值,對於參數的詳細說明在下文參數說明中給出。

公用讀取圖片

對於公用讀取的圖片,可以直接在圖片URL後添加處理參數,以允許任何人永久匿名訪問處理後的圖片。

以下是公用讀取圖片URL添加?x-oss-process=image/resize,parame_value參數的操作說明,您只需要根據您的業務需求將parame_value替換為具體的參數和值,同時,支援多個參數之間的組合使用。

原始圖片URL

添加處理參數後的圖片URL

https://oss-console-img-demo-cn-hangzhou-3az.oss-cn-hangzhou.aliyuncs.com/example1.jpg

https://oss-console-img-demo-cn-hangzhou-3az.oss-cn-hangzhou.aliyuncs.com/example1.jpg?x-oss-process=image/resize,p_50

私人圖片

對於私人圖片,除了在URL後添加處理參數外,還需包括簽名資訊。您可以使用OSS SDK產生帶有圖片縮放參數的簽名URL,以便允許擷取該簽名URL的使用者臨時訪問處理後的圖片。

使用阿里雲SDK

以下僅列舉常見SDK縮放圖片的程式碼範例。如需使用其他SDK縮放圖片的程式碼範例,請參見SDK簡介

使用OSS SDK為私人圖片產生帶?x-oss-process=image/parame_value參數的簽名URL的樣本:

Java

package com.aliyun.oss.demo;
import com.aliyun.oss.*;
import com.aliyun.oss.common.auth.*;
import com.aliyun.oss.common.comm.SignVersion;
import com.aliyun.oss.model.GeneratePresignedUrlRequest;
import java.net.URL;
import java.util.Date;

public class Demo {
    public static void main(String[] args) throws Throwable {
        // Endpoint以華東1(杭州)為例,其它Region請按實際情況填寫。
        String endpoint = "https://oss-cn-hangzhou.aliyuncs.com";
        // 從環境變數中擷取訪問憑證。運行本程式碼範例之前,請確保已設定環境變數OSS_ACCESS_KEY_ID和OSS_ACCESS_KEY_SECRET。
        EnvironmentVariableCredentialsProvider credentialsProvider = CredentialsProviderFactory.newEnvironmentVariableCredentialsProvider();
        // 填寫Bucket名稱,例如examplebucket。
        String bucketName = "examplebucket";
        // 填寫Object完整路徑。如果圖片不在Bucket根目錄,需攜帶圖片完整路徑,例如exampledir/exampleobject.jpg
        String objectName = "exampledir/exampleobject.png";
        // 填寫Bucket所在地區。以華東1(杭州)為例,Region填寫為cn-hangzhou。
        String region = "cn-hangzhou";

        // 建立OSSClient執行個體。
        ClientBuilderConfiguration clientBuilderConfiguration = new ClientBuilderConfiguration();
        clientBuilderConfiguration.setSignatureVersion(SignVersion.V4);
        OSS ossClient = OSSClientBuilder.create()
                .endpoint(endpoint)
                .credentialsProvider(credentialsProvider)
                .clientConfiguration(clientBuilderConfiguration)
                .region(region)
                .build();

        try {
            // 圖片縮放,parame_value需要替換為具體的參數和值,如“p_50”表示圖片等比例縮小為之前的50%
            String style = "image/resize,parame_value";
            // 指定簽名URL到期時間為3600秒)
            Date expiration = new Date(new Date().getTime() + 3600 );
            GeneratePresignedUrlRequest req = new GeneratePresignedUrlRequest(bucketName, objectName, HttpMethod.GET);
            req.setExpiration(expiration);
            req.setProcess(style);
            URL signedUrl = ossClient.generatePresignedUrl(req);
            System.out.println(signedUrl);
        } catch (OSSException oe) {
            System.out.println("Caught an OSSException, which means your request made it to OSS, "
                    + "but was rejected with an error response for some reason.");
            System.out.println("Error Message:" + oe.getErrorMessage());
            System.out.println("Error Code:" + oe.getErrorCode());
            System.out.println("Request ID:" + oe.getRequestId());
            System.out.println("Host ID:" + oe.getHostId());
        } catch (ClientException ce) {
            System.out.println("Caught an ClientException, which means the client encountered "
                    + "a serious internal problem while trying to communicate with OSS, "
                    + "such as not being able to access the network.");
            System.out.println("Error Message:" + ce.getMessage());
        } finally {
            if (ossClient != null) {
                ossClient.shutdown();
            }
        }
    }
}

PHP

<?php
if (is_file(__DIR__ . '/../autoload.php')) 
    require_once __DIR__ . '/../autoload.php';
}
if (is_file(__DIR__ . '/../vendor/autoload.php')) {
    require_once __DIR__ . '/../vendor/autoload.php';
}

use OSS\Credentials\EnvironmentVariableCredentialsProvider;
use OSS\OssClient;

// 從環境變數中擷取訪問憑證。運行本程式碼範例之前,請確保已設定環境變數OSS_ACCESS_KEY_ID和OSS_ACCESS_KEY_SECRET。
$provider = new EnvironmentVariableCredentialsProvider();
// yourEndpoint填寫Bucket所在地區對應的Endpoint。以華東1(杭州)為例,Endpoint填寫為https://oss-cn-hangzhou.aliyuncs.com。
$endpoint = "yourEndpoint";
// 填寫Bucket名稱,例如examplebucket。
$bucket= "examplebucket";
// 填寫Object完整路徑,例如exampledir/exampleobject.jpg。Object完整路徑中不能包含Bucket名稱。
$object = "exampledir/exampleobject.jpg";

$config = array(
        "provider" => $provider,
        "endpoint" => $endpoint,
        "signatureVersion" => OssClient::OSS_SIGNATURE_VERSION_V4,
        "region"=> "cn-hangzhou"
    );
    $ossClient = new OssClient($config);

// 產生一個帶圖片處理參數的簽名的URL,有效期間是3600秒,可以直接使用瀏覽器訪問。
$timeout = 3600;

$options = array(
    // 圖片縮放,parame_value需要替換為具體的參數和值,如“p_50”表示圖片等比例縮小為之前的50%
    OssClient::OSS_PROCESS => "image/resize,parame_value");

$signedUrl = $ossClient->signUrl($bucket, $object, $timeout, "GET", $options);
print("rtmp url: \n" . $signedUrl);

Python

# -*- coding: utf-8 -*-
import oss2
from oss2.credentials import EnvironmentVariableCredentialsProvider

# 從環境變數中擷取訪問憑證。運行本程式碼範例之前,請確保已設定環境變數OSS_ACCESS_KEY_ID和OSS_ACCESS_KEY_SECRET。
auth = oss2.ProviderAuthV4(EnvironmentVariableCredentialsProvider())

# 填寫Bucket名稱
bucket = 'examplebucket'

# 填寫Bucket所在地區對應的Endpoint。以華東1(杭州)為例
endpoint = 'https://oss-cn-hangzhou.aliyuncs.com'

# 填寫阿里雲通用Region ID
region = 'cn-hangzhou'
bucket = oss2.Bucket(auth, endpoint, bucket, region=region)

# 指定原圖名稱。如果圖片不在Bucket根目錄,需攜帶圖片完整路徑,例如exampledir/exampleobject.jpg
key = 'exampledir/exampleobject.png'

# 指定到期時間,單位秒
expire_time = 3600

# 圖片縮放,parame_value需要替換為具體的參數和值,如“p_50”表示圖片等比例縮小為之前的50%
image_process = 'image/resize,parame_value'

# 產生簽名URL,帶上圖片處理參數
url = bucket.sign_url('GET', key, expire_time, params={'x-oss-process': image_process}, slash_safe=True)

# 列印簽名URL
print(url)

Go

package main

import (
	"fmt"
	"os"

	"github.com/aliyun/aliyun-oss-go-sdk/oss"
)

func HandleError(err error) {
	fmt.Println("Error:", err)
	os.Exit(-1)
}

func main() {
	// 從環境變數中擷取訪問憑證。運行本程式碼範例之前,請確保已設定環境變數OSS_ACCESS_KEY_ID和OSS_ACCESS_KEY_SECRET。
	provider, err := oss.NewEnvironmentVariableCredentialsProvider()
	if err != nil {
		fmt.Println("Error:", err)
		os.Exit(-1)
	}

	// 建立OSSClient執行個體。
	// yourEndpoint填寫Bucket對應的Endpoint,以華東1(杭州)為例,填寫為https://oss-cn-hangzhou.aliyuncs.com。其它Region請按實際情況填寫。
	// yourRegion填寫Bucket所在地區,以華東1(杭州)為例,填寫為cn-hangzhou。其它Region請按實際情況填寫。
	clientOptions := []oss.ClientOption{oss.SetCredentialsProvider(&provider)}
	clientOptions = append(clientOptions, oss.Region("yourRegion"))
	// 設定簽名版本
	clientOptions = append(clientOptions, oss.AuthVersion(oss.AuthV4))
	client, err := oss.New("yourEndpoint", "", "", clientOptions...)
	if err != nil {
		HandleError(err)
	}

	// 指定圖片所在Bucket的名稱,例如examplebucket。
	bucketName := "examplebucket"
	bucket, err := client.Bucket(bucketName)
	if err != nil {
		HandleError(err)
	}
	// 指定圖片名稱。如果圖片不在Bucket根目錄,需攜帶檔案完整路徑,例如exampledir/exampleobject.jpg。
	ossImageName := "exampledir/exampleobject.png"
	// 產生帶簽名的URL,並指定到期時間為3600s。(最長有效時間為32400秒)
	// 圖片縮放,parame_value需要替換為具體的參數和值,如“p_50”表示圖片等比例縮小為之前的50%
	signedURL, err := bucket.SignURL(ossImageName, oss.HTTPGet, 3600, oss.Process("image/resize,parame_value"))
	if err != nil {
		HandleError(err)
	} else {
		fmt.Println(signedURL)
	}
}

產生的簽名URL樣本如下:

https://examplebucket.oss-cn-hangzhou.aliyuncs.com/exampledir/exampleobject.png?x-oss-process=image%2Fresize%2Cp_50&x-oss-date=20241111T113707Z&x-oss-expires=3600&x-oss-signature-version=OSS4-HMAC-SHA256&x-oss-credential=LTAI********************%2F20241111%2Fcn-hangzhou%2Foss%2Faliyun_v4_request&x-oss-signature=6fd07a2ba50bf6891474dc56aed976b556b6fbcd901cfd01bcde5399bf4802cb

使用REST API

如果您的程式自訂要求較高,您可以直接發起REST API請求。直接發起REST API請求需要手動編寫代碼計算簽名。關於公用要求標頭Authorization的計算方法,請參見簽名版本4(推薦)

您可以通過在GetObject介面中添加圖片縮放參數的方式來處理圖片。更多資訊,請參見GetObject

GET /oss.jpg?x-oss-process=image/resize,p_50 HTTP/1.1
Host: oss-example.oss-cn-hangzhou.aliyuncs.com
Date: Fri, 28 Oct 2022 06:40:10 GMT
Authorization: SignatureValue

參數說明

操作名稱:resize

parame參數和value取值說明:

等比例縮放

名稱參數

描述

取值範圍

p

按百分比縮放圖片。

[1,1000]

小於100為縮小,大於100為放大。

指定寬高縮放

參數

描述

取值

w

指定目標縮放圖的寬度。

[1,16384]

h

指定目標縮放圖的高度。

[1,16384]

m

指定縮放的模式。

  • lfit(預設值):等比縮放至指定寬高地區內最大圖形。

  • mfit:等比縮放至覆蓋指定寬高地區。

  • fill:等比縮放至覆蓋指定寬高地區並置中裁剪。

  • pad:等比縮放至指定寬高內最大圖形並填充顏色至指定尺寸。

  • fixed:固定寬高,強制縮放。

關於按不同模式進行縮放後得到的圖片說明,請參見縮放計算方式

說明

當縮放模式設定為m模式下的任意值,並且指定了目標縮放圖的寬度(w)或高度(h),則目標縮放圖的最長邊(l)或最短邊(s)的設定將不會生效。

l

指定目標縮放圖的最長邊。

說明

長邊是指原尺寸與目尺規寸的比值大的那條邊。例如原圖為100 px*200 px,縮放為100px*100 px,由於200/100=2,100/100=1,2>1,所以在這個縮放中200那條是長邊,100那條是短邊。

[1,16384]

s

指定目標縮放圖的最短邊。

說明

當僅選擇l(長邊)或s(短邊)進行指定時,圖片將按指定的邊進行縮放,而另一邊則根據原圖的比例自動調整,此時m參數的設定不起作用。

當同時設定了ls參數時,圖片的縮放會基於保持長寬比的原則進行,此時m參數將發揮作用。若未明確指定縮放模式,系統將採用預設的lfit方式處理。

[1,16384]

limit

當靶心圖表片解析度大於原圖解析度時,設定是否進行縮放。

重要

目標縮放圖比原圖尺寸大時,預設返回原圖。如果您想放大圖片,您需要增加limit_0參數。

  • 1(預設值):返回按照原圖解析度轉換的圖片(可能和原圖的體積不一樣)。

  • 0:按指定參數進行縮放。

說明

GIF格式的圖片只支援縮小,不支援放大。

color

當縮放模式選擇為pad(縮放填充)時,可以設定填充的顏色。

RGB顏色值,例如:000000表示黑色,FFFFFF表示白色。

預設值:FFFFFF(白色)

說明

若縮放時只指定寬度或者高度:

  • 縮放模式為lfit,mfit,fixed時,會按比例縮放圖片。例如原圖為256px*144 px,將高縮放為100 px,則寬縮放為178px。

  • 縮放模式為pad,fill時,會將原圖寬高按照指定值進行縮放。例如原圖為256px*144px,將高縮放為100 px,則寬也縮放為100 px。

縮放計算方式

原圖大小

指定縮放參數

縮放模式

縮放後大小

200 px*100 px

150 px*80 px

lfit(預設值)

等比縮放,縮圖限制在指定w與h的矩形內的最大圖片。

150 px*75 px

lfit

mfit

等比縮放,縮圖為延伸出指定w與h的矩形框外的最小圖片。

160 px*80 px

mfit

fill

等比縮放,縮圖為延伸出指定w與h的矩形框外的最小圖片,之後按照固定寬高進行裁剪。

150 px*80 px

fill

pad

等比縮放,縮圖限制在指定w與h的矩形內的最大圖片再按照固定寬高進行顏色填充。

150 px*80 px

pad

fixed

按照固定寬高強制縮放,若寬高與原圖寬高比例不同,則會導致圖片變形。

150 px*80 px

fixed

說明

當縮放模式指定為lfit或mfit時,如果等比為小數,則四捨五入保留整數。

使用樣本

等比例縮小

在圖片URL末尾添加?x-oss-process=image/resize,p_{percentage}時,OSS會即時處理該圖片,並按指定的百分比進行等比例縮小,返回處理後的結果。image/resize表示進行縮放處理,p表示按百分比縮放。p的取值範圍為[1, 100]時表示按百分比縮小,p的取值必須為正整數。

效果樣本

以下是使用?x-oss-process=image/resize,p_50將圖片縮小至原尺寸的50%的樣本:

對比專案

原圖

處理後的圖片

圖片預覽

image

image

URL

原圖URL: https://oss-console-img-demo-cn-hangzhou-3az.oss-cn-hangzhou.aliyuncs.com/example1.jpg

圖片處理URL: https://oss-console-img-demo-cn-hangzhou-3az.oss-cn-hangzhou.aliyuncs.com/example1.jpg?x-oss-process=image/resize,p_50

圖片尺寸

2500 x 1875 px

1250 x 938 px

等比例放大

在圖片URL末尾添加?x-oss-process=image/resize,p_{percentage}時,OSS會即時處理該圖片,並按指定的百分比進行等比例縮放,返回處理後的結果。其中,image/resize表示進行縮放處理,p表示按百分比縮放。p的取值範圍為[100, 1000]時,表示按百分比放大。p的取值必須為正整數。

效果樣本

以下是使用?x-oss-process=image/resize,p_120將圖片放大至原尺寸的120%的樣本:

對比專案

原圖

處理後的圖片

圖片預覽

image

image

URL

原圖URL: https://oss-console-img-demo-cn-hangzhou-3az.oss-cn-hangzhou.aliyuncs.com/example1.jpg

圖片處理URL: https://oss-console-img-demo-cn-hangzhou-3az.oss-cn-hangzhou.aliyuncs.com/example1.jpg?x-oss-process=image/resize,p_120

圖片尺寸

2500 x 1875 px

3000 x 2250 px

寬度固定,高度自適應縮小

在圖片URL末尾添加?x-oss-process=image/resize,w_{width}時,OSS將即時處理該圖片,並根據指定的寬度進行等比例縮小,返回處理後的結果。其中,image/resize表示進行縮放處理,w表示期望的圖片寬度。w的取值範圍為[1,16384]w的取值必須為正整數。

效果樣本

以下是使用?x-oss-process=image/resize,w_200將圖片寬度固定為200像素,高度自適應進行縮小的樣本:

對比專案

原圖

處理後的圖片

圖片預覽

image

image

URL

原圖URL: https://oss-console-img-demo-cn-hangzhou-3az.oss-cn-hangzhou.aliyuncs.com/example1.jpg

圖片處理URL:https://oss-console-img-demo-cn-hangzhou-3az.oss-cn-hangzhou.aliyuncs.com/example1.jpg?x-oss-process=image/resize,w_200

圖片尺寸

2500 x 1875 px

200 x 150 px

寬度固定,高度自適應放大

在圖片URL末尾添加?x-oss-process=image/resize,w_{width}時,OSS將即時處理該圖片,並根據指定的寬度進行等比例縮放,返回處理後的結果。其中,image/resize表示進行縮放處理,w表示期望的圖片寬度。w的取值範圍為[1,16384]w的取值必須為正整數。

重要

由於當目標縮放圖比原圖尺寸大時,預設返回原圖。如果您想放大圖片,您需要增加limit_0參數。

效果樣本

以下是使用?x-oss-process=image/resize,w_3000,limit_0將圖片寬度固定3000像素,高度自適應進行放大的樣本:

對比專案

原圖

處理後的圖片

圖片預覽

image

image

URL

原圖URL: https://oss-console-img-demo-cn-hangzhou-3az.oss-cn-hangzhou.aliyuncs.com/example1.jpg

圖片處理URL:https://oss-console-img-demo-cn-hangzhou-3az.oss-cn-hangzhou.aliyuncs.com/example1.jpg?x-oss-process=image/resize,w_3000,limit_0

圖片尺寸

2500 x 1875 px

3000 x 2250 px

高度固定,寬度自適應縮小

在圖片URL末尾添加?x-oss-process=image/resize,h_{height}時,OSS將即時處理該圖片,並根據指定的高度進行等比例縮放,返回處理後的結果。其中,image/resize表示進行縮放處理,h表示期望的圖片高度。h的取值範圍為[1,16384]h的取值必須為正整數。

效果樣本

以下是使用?x-oss-process=image/resize,h_100將圖片高度固定為100像素,寬度自適應進行縮小的樣本:

對比專案

原圖

處理後的圖片

圖片預覽

image

image

URL

原圖URL: https://oss-console-img-demo-cn-hangzhou-3az.oss-cn-hangzhou.aliyuncs.com/example1.jpg

圖片處理URL:https://oss-console-img-demo-cn-hangzhou-3az.oss-cn-hangzhou.aliyuncs.com/example1.jpg?x-oss-process=image/resize,h_100

圖片尺寸

2500 x 1875 px

133 x 100 px

高度固定,寬度自適應放大

在圖片URL末尾添加?x-oss-process=image/resize,h_{height}時,OSS將即時處理該圖片,並根據指定的高度進行等比例縮放,返回處理後的結果。其中,image/resize表示進行縮放處理,h表示期望的圖片高度。h的取值範圍為[1,16384]h的取值必須為正整數。

重要

由於當目標縮放圖比原圖尺寸大時,預設返回原圖。如果您想放大圖片,您需要增加limit_0參數。

效果樣本

以下是使用?x-oss-process=image/resize,h_2000,limit_0將圖片高度固定為2000像素,寬度自適應進行縮放的樣本:

對比專案

原圖

處理後的圖片

圖片預覽

image

image

URL

原圖URL: https://oss-console-img-demo-cn-hangzhou-3az.oss-cn-hangzhou.aliyuncs.com/example1.jpg

圖片處理URL:https://oss-console-img-demo-cn-hangzhou-3az.oss-cn-hangzhou.aliyuncs.com/example1.jpg?x-oss-process=image/resize,h_2000,limit_0

圖片尺寸

2500 x 1875 px

2667 x 2000 px

長邊固定,短邊自適應縮放

說明

長邊是指在原圖尺寸與靶心圖表尺寸之間,其比例較大的那一邊。例如,如果原始映像的尺寸為100px * 200px,而目尺規寸為100px * 100px,則計算兩邊的比例分別為100/100 = 1 和 200/100 = 2。因為2大於1,所以在這種縮放情況下,原圖中的200px邊被認為是長邊,而100px邊則是短邊。

按長邊縮放,圖片將按指定的長邊進行縮放,而短邊則根據原圖的比例自動調整,此時縮放模式m參數的設定不起作用。

在圖片URL末尾添加image/resize,l_{length}時,OSS將即時處理該圖片,並根據長邊進行等比例縮放,返回處理後的結果。其中,image/resize表示進行縮放處理,l表示長邊,l的取值範圍為[1,16384],l的取值必須為正整數。

重要

由於當目標縮放圖比原圖尺寸大時,預設返回原圖。如果您想放大圖片,您需要增加limit_0參數。

效果樣本

以下是使用?x-oss-process=image/resize,l_200將長邊固定為200,短邊自適應進行縮放的樣本:

對比專案

原圖

處理後的圖片

圖片預覽

image

image

URL

原圖URL: https://oss-console-img-demo-cn-hangzhou-3az.oss-cn-hangzhou.aliyuncs.com/example1.jpg

圖片處理URL:https://oss-console-img-demo-cn-hangzhou-3az.oss-cn-hangzhou.aliyuncs.com/example1.jpg?x-oss-process=image/resize,l_200

圖片尺寸

2500 x 1875 px

200 x 150 px

短邊固定,長邊自適應縮放

圖片將按指定的短邊進行縮放,而另一邊則根據原圖的比例自動調整,此時縮放模式m參數的設定不起作用。

在圖片URL末尾添加image/resize,s_{length}時,OSS將即時處理該圖片,並根據短邊進行等比例縮放,返回處理後的結果。其中,image/resize表示進行縮放處理,s表示短邊,s的取值範圍為[1,16384],s的取值必須為正整數。

重要

由於當目標縮放圖比原圖尺寸大時,預設返回原圖。如果您想放大圖片,您需要增加limit_0參數。

效果樣本

以下是使用?x-oss-process=image/resize,s_200,limit_0將短邊固定為200,長邊自適應進行縮放的樣本:

對比專案

原圖

處理後的圖片

圖片預覽

image

image

URL

原圖URL: https://oss-console-img-demo-cn-hangzhou-3az.oss-cn-hangzhou.aliyuncs.com/example1.jpg

圖片處理URL:https://oss-console-img-demo-cn-hangzhou-3az.oss-cn-hangzhou.aliyuncs.com/example1.jpg?x-oss-process=image/resize,s_200

圖片尺寸

2500 x 1875 px

267 x 200 px

固定寬高,縮減填充

固定寬高,縮減填充在保持映像比例的同時將映像調整到指定的寬度和高度。

在圖片URL末尾添加image/resize,m_pad,w_{height},h_{height},color_{RGB}時,OSS將即時處理該圖片,並返回處理後的結果。其中,image/resize表示進行縮放處理,m_pad表示圖片縮放為指定w與h的矩形內的最大圖片,color表示指定置中填充空白部分的顏色,若不設定該參數,預設用白色填充。w表示期望的圖片寬度,h表示期望的圖片高度。wh的取值範圍都為[1,16384]wh的取值必須為正整數。

效果樣本

以下是使用?x-oss-process=image/resize,m_pad,w_100,h_100將圖片寬度和高度都固定為100像素進行縮減填充縮放的樣本:

對比專案

原圖

處理後的圖片

圖片預覽

image

image

URL

原圖URL: https://oss-console-img-demo-cn-hangzhou-3az.oss-cn-hangzhou.aliyuncs.com/example1.jpg

https://oss-console-img-demo-cn-hangzhou-3az.oss-cn-hangzhou.aliyuncs.com/example1.jpg?x-oss-process=image/resize,m_pad,w_100,h_100

圖片尺寸

2500 x 1875 px

100 x 100 px

以下是使用?x-oss-process=image/resize,m_pad,w_100,h_100,color_FF0000將圖片寬度和高度都固定為100像素,設定填充顏色為紅色進行縮減填充縮放的樣本:

對比專案

原圖

處理後的圖片

圖片預覽

image

image

URL

原圖URL: https://oss-console-img-demo-cn-hangzhou-3az.oss-cn-hangzhou.aliyuncs.com/example1.jpg

https://oss-console-img-demo-cn-hangzhou-3az.oss-cn-hangzhou.aliyuncs.com/example1.jpg?x-oss-process=image/resize,m_pad,w_100,h_100,color_FF0000

圖片尺寸

2500 x 1875 px

100 x 100 px

固定寬高,置中裁剪

固定寬高,置中裁剪在原始映像的寬高比與目尺規寸的寬高比不一致時會根據目尺規寸的寬度或高度進行等比例縮放,並在縮放後將映像置中裁剪以達到固定的寬高比。

在圖片URL末尾添加image/resize,m_fill,w_{height},h_{height}時,OSS將即時處理該圖片,並根據指定的寬度和高度進行縮放,返回處理後的結果。其中,image/resize表示進行縮放處理,m_fill表示圖片等比縮放為延伸出指定w與h的矩形框外的最小圖片,超出的部分進行置中裁剪。w表示期望的圖片寬度,h表示期望的圖片高度。wh的取值範圍都為[1,16384]wh的取值必須為正整數。

效果樣本

以下是使用?x-oss-process=image/resize,m_fill,w_100,h_100將圖片寬度和高度都固定為100像素進行置中裁剪縮放的樣本:

對比專案

原圖

處理後的圖片

圖片預覽

image

image

URL

原圖URL: https://oss-console-img-demo-cn-hangzhou-3az.oss-cn-hangzhou.aliyuncs.com/example1.jpg

https://oss-console-img-demo-cn-hangzhou-3az.oss-cn-hangzhou.aliyuncs.com/example1.jpg?x-oss-process=image/resize,m_fill,w_100,h_100

圖片尺寸

2500 x 1875 px

100 x 100 px

強制寬高縮放

固定寬高,強制縮放用於將映像調整為指定的寬度和高度,而不考慮原始映像的寬高比。這種處理方式可能會導致映像變形,因為映像會被展開或縮放以適應新的尺寸。

在圖片URL末尾添加image/resize,m_fixed,w_{height},h_{height}時,OSS將即時處理該圖片,並根據指定的寬度和高度進行強制縮放,返回處理後的結果。其中,image/resize表示進行縮放處理,m_fixed表示圖片。w表示期望的圖片寬度,h表示期望的圖片高度。wh的取值範圍都為[1,16384]wh的取值必須為正整數。

效果樣本

以下是使用?x-oss-process=image/resize,m_fixed,w_100,h_100將圖片寬度和高度都固定為100像素進行置中裁剪縮放的樣本:

對比專案

原圖

處理後的圖片

圖片預覽

image

image

URL

原圖URL: https://oss-console-img-demo-cn-hangzhou-3az.oss-cn-hangzhou.aliyuncs.com/example1.jpg

https://oss-console-img-demo-cn-hangzhou-3az.oss-cn-hangzhou.aliyuncs.com/example1.jpg?x-oss-process=image/resize,m_fixed,w_100,h_100

圖片尺寸

2500 x 1875 px

100 x 100 px

常見問題

如何持久化儲存處理後的圖片?

OSS會根據請求的參數即時產生圖片,預設不儲存處理後的圖片。對於經常需要展示相同處理結果(例如縮圖、裁剪圖或格式轉換後的圖片)的應用情境,您可以使用OSS圖片處理持久化功能在圖片處理的請求中添加轉存參數,並將處理後的圖片儲存至指定的Bucket。具體操作,請參見圖片處理持久化

縮放後的圖片讀寫權限為私人,如何正常訪問?

必須對圖片檔案URL完成簽名操作後才能正常訪問。具體操作請參見上傳Object後如何擷取訪問URL

圖片縮放是否產生圖片資料處理費用?

圖片縮放會產生圖片資料處理費用,按處理的原圖實際大小計費。圖片縮放每月提供10TB的免費額度,超出部分按照0.025元/GB進行計費。

請求縮放後的圖片產生的下行流量是按原圖還是縮放後的圖片計算?

請求縮放後的圖片產生的下行流量費用按照縮放後的流量計算。例如原圖為20 MB,縮放後大小為2 MB,圖片產生的流量按照2 MB計算。

按寬高放大圖片不生效怎麼辦?

按寬高放大圖片時,需要設定limit參數為0,否則放大不生效。

例如:在以下圖片中,將圖片高度由原來的1875 px放大為2000 px。

https://oss-console-img-demo-cn-hangzhou-3az.oss-cn-hangzhou.aliyuncs.com/example1.jpg?x-oss-process=image/resize,h_2000,limit_0

圖片縮放的參數不生效怎麼辦?

請檢查是否正在使用CDN網域名稱,並確認是否關閉忽略參數緩衝功能。若通過CDN啟用了過濾參數選項,則檔案URL請求中的所有查詢參數(位於問號“?”之後)將被移除,導致直接存取到未帶參數的原始檔案,如example.jpg。為確保正確緩衝與訪問請關閉CDN的忽略參數緩衝功能,具體操作可參考忽略參數。然而,關閉此功能意味著帶有不同參數的URL將被視為獨立的請求,可能導致回源至OSS的頻率上升,影響緩衝效率。

原圖WebP解碼異常怎麼辦?

WebP解碼異常,可能是因為圖片為動圖,可以開通WebP動圖解碼功能。