If you want to protect sensitive information or improve the visual effect of an image stored in Object Storage Service (OSS), you can blur the whole image or part of the image.
Scenarios
Privacy protection: Before you publish an image that contains sensitive information, such as license plate numbers and faces, you can blur part of the image.
Better visual experience for an image composed of multiple layers: Properly blurring the image can smooth the edges between different layers to provide a more comfortable visual experience.
Better display of a low-resolution image: When the resolution of an image is low and cannot meet the requirements of a high-definition display, you can blur the image.
Methods
You can use object URLs and OSS SDKs or call API operations to configure image processing (IMG) parameters that are used to process images. You can use object URLs to configure IMG parameters only for public-read or public-read-write images. If you want to configure IMG parameters for private images, use OSS SDKs or call API operations. For more information, see IMG implementation modes.
Blur a public-read or public-read-write image
If the access control list (ACL) of the image object that you want to process is public-read or public-read-write, you can add IMG parameters to the URL of the object to allow anonymous users to access the processed object.
In this example, ?x-oss-process=image/blur,parame_value is added to the end of the URL of a public-read image. You need to only replace parame_value with the specific parameters and values described in the Parameters section based on your business requirements. You can add multiple parameters to the URL.
URL of the source image | URL used to process the source image |
https://oss-console-img-demo-cn-hangzhou-3az.oss-cn-hangzhou.aliyuncs.com/example1.jpg |
Blur a private image
Use OSS SDKs
The following sample code provides examples on how to blur a private image by using OSS SDKs for common programming languages. For more information about how to blur a private image by using other programming languages, see Overview.
Java
OSS SDK for Java 3.17.4 or later is required.
import com.aliyun.oss.*;
import com.aliyun.oss.common.auth.*;
import com.aliyun.oss.common.comm.SignVersion;
import com.aliyun.oss.model.GetObjectRequest;
import java.io.File;
public class Demo {
public static void main(String[] args) throws Throwable {
// Specify the endpoint of the region. In this example, the endpoint of the China (Hangzhou) region is used. Specify your actual endpoint.
String endpoint = "https://oss-cn-hangzhou.aliyuncs.com";
// Specify the region in which the bucket is located. Example: cn-hangzhou.
String region = "cn-hangzhou";
// Obtain access credentials from environment variables. Before you run the sample code, make sure that the OSS_ACCESS_KEY_ID and OSS_ACCESS_KEY_SECRET environment variables are configured.
EnvironmentVariableCredentialsProvider credentialsProvider = CredentialsProviderFactory.newEnvironmentVariableCredentialsProvider();
// Specify the name of the bucket. Example: examplebucket.
String bucketName = "examplebucket";
// Specify the full path of the image that you want to process. Do not include the bucket name in the full path.
String objectName = "src.jpg";
// Specify the full path to which you want to save the processed image. Example: D:\\localpath\\example-new.jpg. If an image that has the same name already exists in the path, the processed image overwrites the existing image. Otherwise, the processed image is saved in the path.
String pathName = "D:\\dest.jpg";
// Create an OSSClient instance.
// Call the shutdown method to release resources when the OSSClient is no longer in use.
ClientBuilderConfiguration clientBuilderConfiguration = new ClientBuilderConfiguration();
clientBuilderConfiguration.setSignatureVersion(SignVersion.V4);
OSS ossClient = OSSClientBuilder.create()
.endpoint(endpoint)
.credentialsProvider(credentialsProvider)
.clientConfiguration(clientBuilderConfiguration)
.region(region)
.build();
try {
// Set the blur radius to 10 and the standard deviation of a normal distribution to 10.
String image = "image/blur,r_10,s_10";
GetObjectRequest request = new GetObjectRequest(bucketName, objectName);
request.setProcess(image);
// Set the name of the processed image to dest.jpg and save it to your local computer.
// If you specify only the name of the processed image, such as dest.jpg, without specifying the local path, the processed image is saved to the local path of the project to which the sample program belongs.
ossClient.getObject(request, new File("D:\\dest.jpg"));
} 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
OSS SDK for PHP 2.7.0 or later is required.
<?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;
// Obtain access credentials from environment variables. Before you run the sample code, make sure that the OSS_ACCESS_KEY_ID and OSS_ACCESS_KEY_SECRET environment variables are configured.
$provider = new EnvironmentVariableCredentialsProvider();
// Specify the endpoint of the region in which the bucket is located. For example, if the bucket is located in the China (Hangzhou) region, set the endpoint to https://oss-cn-hangzhou.aliyuncs.com.
$endpoint = "https://oss-cn-hangzhou.aliyuncs.com";
// Specify the name of the bucket. Example: examplebucket.
$bucket= "examplebucket";
// Specify the full path of the object. Example: exampledir/exampleobject.jpg. Do not include the bucket name in the full path.
$object = "src.jpg";
// Specify the full path to which you want to save the processed image. Example: D:\\localpath\\example-new.jpg. If an image that has the same name already exists in the path, the processed image overwrites the existing image. Otherwise, the processed image is saved in the path.
// If you specify only the name of the processed image, such as example-new.jpg, without specifying the local path, the processed image is saved to the local path of the project to which the sample program belongs.
$download_file = "D:\\dest.jpg";
$config = array(
"provider" => $provider,
"endpoint" => $endpoint,
"signatureVersion" => OssClient::OSS_SIGNATURE_VERSION_V4,
// Specify the ID of the Alibaba Cloud region in which the bucket is located.
"region" => "cn-hangzhou"
);
$ossClient = new OssClient($config);
// Set the blur radius to 10 and the standard deviation of a normal distribution to 10.
$image = "image/blur,r_10,s_10";
$options = array(
OssClient::OSS_FILE_DOWNLOAD => $download_file,
OssClient::OSS_PROCESS => $image);
// Save the processed image to your local computer.
$ossClient->getObject($bucket, $object, $options); Python
OSS SDK for Python 2.18.4 or later is required.
# -*- coding: utf-8 -*-
import oss2
from oss2.credentials import EnvironmentVariableCredentialsProvider
# Obtain access credentials from environment variables. Before you run the sample code, make sure that the OSS_ACCESS_KEY_ID and OSS_ACCESS_KEY_SECRET environment variables are configured.
auth = oss2.ProviderAuthV4(EnvironmentVariableCredentialsProvider())
# Specify the endpoint of the region in which the bucket is located. For example, if the bucket is located in the China (Hangzhou) region, set the endpoint to https://oss-cn-hangzhou.aliyuncs.com.
# Specify the endpoint of the region in which the bucket is located. For example, if the bucket is located in the China (Hangzhou) region, set the endpoint to https://oss-cn-hangzhou.aliyuncs.com.
endpoint = 'https://oss-cn-hangzhou.aliyuncs.com'
# Specify the ID of the Alibaba Cloud region in which the bucket is located.
region = 'cn-hangzhou'
bucket = oss2.Bucket(auth, endpoint, 'examplebucket', region=region)
# Specify the name of the image that you want to process. If the source image is not stored in the root directory of the bucket, you must specify the full path of the image. Example: exampledir/example.jpg.
key = 'src.jpg'
# Specify the name of the processed image.
new_pic = 'D:\\dest.jpg'
# Set the blur radius to 10 and the standard deviation of a normal distribution to 10.
image = 'image/blur,r_10,s_10'
bucket.get_object_to_file(key, new_pic, process=image)Go
OSS SDK for Go 3.0.2 or later is required.
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() {
// Obtain access credentials from environment variables. Before you run the sample code, make sure that the OSS_ACCESS_KEY_ID and OSS_ACCESS_KEY_SECRET environment variables are configured.
provider, err := oss.NewEnvironmentVariableCredentialsProvider()
if err != nil {
fmt.Println("Error:", err)
os.Exit(-1)
}
// Create an OSSClient instance.
// Specify the endpoint of the region in which the bucket is located. For example, if the bucket is located in the China (Hangzhou) region, set the endpoint to https://oss-cn-hangzhou.aliyuncs.com. Specify your actual endpoint.
client, err := oss.New("https://oss-cn-hangzhou.aliyuncs.com", "", "", oss.SetCredentialsProvider(&provider), oss.AuthVersion(oss.AuthV4), oss.Region("cn-hangzhou"))
if err != nil {
HandleError(err)
}
// Specify the name of the bucket. Example: examplebucket.
bucketName := "examplebucket"
bucket, err := client.Bucket(bucketName)
if err != nil {
HandleError(err)
}
// Specify the name of the source image. If the source image is not stored in the root directory of the bucket, you must specify the full path of the image. Example: exampledir/example.jpg.
sourceImageName := "src.jpg"
// Specify the name of the processed image.
targetImageName := "D://dest.jpg"
// Set the blur radius to 10 and the standard deviation of a normal distribution to 10.
image := "image/blur,r_10,s_10"
err = bucket.GetObjectToFile(sourceImageName, targetImageName, oss.Process(image))
if err != nil {
HandleError(err)
}
}Use the OSS API
If your business requires a high level of customization, you can directly call RESTful API operations. To directly call an API, you must include the signature calculation in your code. For more information about how to calculate the Authorization header, see (Recommended) Include a V4 signature in the Authorization header.
You can specify blur parameters in the GetObject operation to blur a private image. For more information, see GetObject.
GET /oss.jpg?x-oss-process=image/blur,r_10,s_10 HTTP/1.1
Host: oss-example.oss-cn-hangzhou.aliyuncs.com
Date: Fri, 28 Oct 2022 06:40:10 GMT
Authorization: SignatureValueBlur a private image (bind the bucket to an IMM project)
Before you use the g_face or g_faces parameter to blur a private image, you must bind the bucket in which the private image is stored to an Intelligent Media Management (IMM) project. For more information, see Get started.
Use OSS SDKs
The following sample code provides examples on how to blur a private image by using OSS SDKs for common programming languages. For more information about how to blur a private image by using other programming languages, see Overview.
Java
OSS SDK for Java 3.17.4 or later is required.
import com.aliyun.oss.*;
import com.aliyun.oss.common.auth.*;
import com.aliyun.oss.common.comm.SignVersion;
import com.aliyun.oss.model.GetObjectRequest;
import java.io.File;
public class Demo {
public static void main(String[] args) throws Throwable {
// Specify the endpoint of the region. In this example, the endpoint of the China (Hangzhou) region is used. Specify your actual endpoint.
String endpoint = "https://oss-cn-hangzhou.aliyuncs.com";
// Specify the region in which the bucket is located. Example: cn-hangzhou.
String region = "cn-hangzhou";
// Obtain access credentials from environment variables. Before you run the sample code, make sure that the OSS_ACCESS_KEY_ID and OSS_ACCESS_KEY_SECRET environment variables are configured.
EnvironmentVariableCredentialsProvider credentialsProvider = CredentialsProviderFactory.newEnvironmentVariableCredentialsProvider();
// Specify the name of the bucket. Example: examplebucket.
String bucketName = "examplebucket";
// Specify the full path of the source image. Do not include the bucket name in the full path.
String objectName = "example.jpg";
// Specify the full path to which you want to save the processed image. Example: D:\\dest.jpg. If an image that has the same name already exists in the path, the processed image overwrites the existing image. Otherwise, the processed image is saved in the path.
String pathName = "D:\\dest.jpg";
// Create an OSSClient instance.
// Call the shutdown method to release resources when the OSSClient is no longer in use.
ClientBuilderConfiguration clientBuilderConfiguration = new ClientBuilderConfiguration();
clientBuilderConfiguration.setSignatureVersion(SignVersion.V4);
OSS ossClient = OSSClientBuilder.create()
.endpoint(endpoint)
.credentialsProvider(credentialsProvider)
.clientConfiguration(clientBuilderConfiguration)
.region(region)
.build();
try {
// Set the blur scope to all human faces. Set the blur radius of all human faces to 25 and the standard deviation of a normal distribution to 50.
String image = "image/blur,g_faces,r_25,s_50";
GetObjectRequest request = new GetObjectRequest(bucketName, objectName);
request.setProcess(image);
// Save the processed image to your local computer.
// If you specify only the name of the processed image, such as dest.jpg, without specifying the local path, the processed image is saved to the local path of the project to which the sample program belongs.
ossClient.getObject(request, new File("D:\\dest.jpg"));
} 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
OSS SDK for PHP 2.7.0 or later is required.
<?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;
// Obtain access credentials from environment variables. Before you run the sample code, make sure that the OSS_ACCESS_KEY_ID and OSS_ACCESS_KEY_SECRET environment variables are configured.
$provider = new EnvironmentVariableCredentialsProvider();
// Specify the endpoint of the region in which the bucket is located. For example, if the bucket is located in the China (Hangzhou) region, set the endpoint to https://oss-cn-hangzhou.aliyuncs.com.
$endpoint = "https://oss-cn-hangzhou.aliyuncs.com";
// Specify the name of the bucket. Example: examplebucket.
$bucket= "examplebucket";
// Specify the full path of the source image. Do not include the bucket name in the full path.
$object = "src.jpg";
// Specify the full path to which you want to save the processed image. Example: D:\\dest.jpg. If an image that has the same name already exists in the path, the processed image overwrites the existing image. Otherwise, the processed image is saved in the path.
// If you specify only the name of the processed image such as dest.jpg without specifying the local path, the processed image is saved to the local path of the project to which the sample program belongs.
$download_file = "D:\\dest.jpg";
$config = array(
"provider" => $provider,
"endpoint" => $endpoint,
"signatureVersion" => OssClient::OSS_SIGNATURE_VERSION_V4,
// Specify the ID of the Alibaba Cloud region in which the bucket is located.
"region" => "cn-hangzhou"
);
$ossClient = new OssClient($config);
// Set the blur scope to all human faces. Set the blur radius of all human faces to 25 and the standard deviation of a normal distribution to 50.
$image = "image/blur,g_faces,r_25,s_50";
$options = array(
OssClient::OSS_FILE_DOWNLOAD => $download_file,
OssClient::OSS_PROCESS => $image);
// Save the processed image to your local computer.
$ossClient->getObject($bucket, $object, $options); Python
OSS SDK for Python 2.18.4 or later is required.
# -*- coding: utf-8 -*-
import oss2
from oss2.credentials import EnvironmentVariableCredentialsProvider
# Obtain access credentials from environment variables. Before you run the sample code, make sure that the OSS_ACCESS_KEY_ID and OSS_ACCESS_KEY_SECRET environment variables are configured.
auth = oss2.ProviderAuthV4(EnvironmentVariableCredentialsProvider())
# Specify the endpoint of the region in which the bucket is located. For example, if the bucket is located in the China (Hangzhou) region, set the endpoint to https://oss-cn-hangzhou.aliyuncs.com.
endpoint = 'https://oss-cn-hangzhou.aliyuncs.com'
# Specify the ID of the Alibaba Cloud region in which the bucket is located.
region = 'cn-hangzhou'
bucket = oss2.Bucket(auth, endpoint, 'examplebucket', region=region)
# If the source image is stored in the root directory of the bucket, you can specify only the image name. Example: source-example.jpg. If the source image is not stored in the root directory of the bucket, you must specify the full path of the source image. Example: exampledir/source-example.jpg.
key = 'source-example.jpg'
# Specify the full path to which you want to save the processed image. Example: D:\\target-example.jpg. If an image that has the same name already exists in the path, the processed image overwrites the existing image. Otherwise, the processed image is saved in the path.
local_file_name = 'D:\\target-example.jpg'
# Set the blur scope to all human faces. Set the blur radius of all human faces to 25 and the standard deviation of a normal distribution to 50.
process = 'image/blur,g_faces,r_25,s_50'
# Use the get_object method and pass the processing instruction by using the process parameter.
result = bucket.get_object_to_file(key, local_file_name, process=process)Go
OSS SDK for Go 3.0.2 or later is required.
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() {
// Obtain access credentials from environment variables. Before you run the sample code, make sure that the OSS_ACCESS_KEY_ID and OSS_ACCESS_KEY_SECRET environment variables are configured.
provider, err := oss.NewEnvironmentVariableCredentialsProvider()
if err != nil {
fmt.Println("Error:", err)
os.Exit(-1)
}
// Create an OSSClient instance.
// Specify the endpoint of the region in which the bucket is located. For example, if the bucket is located in the China (Hangzhou) region, set the endpoint to https://oss-cn-hangzhou.aliyuncs.com. Specify your actual endpoint.
client, err := oss.New("https://oss-cn-hangzhou.aliyuncs.com", "", "", oss.SetCredentialsProvider(&provider), oss.AuthVersion(oss.AuthV4), oss.Region("cn-hangzhou"))
if err != nil {
HandleError(err)
}
// Specify the name of the bucket. Example: examplebucket.
bucketName := "examplebucket"
bucket, err := client.Bucket(bucketName)
if err != nil {
HandleError(err)
}
// Specify the name of the source image. If the source image is not stored in the root directory of the bucket, you must specify the full path of the image. Example: exampledir/example.jpg.
sourceImageName := "example.jpg"
// Specify the name of the processed image.
targetImageName := "D://dest.jpg"
// Set the blur scope to all human faces. Set the blur radius of all human faces to 25 and the standard deviation of a normal distribution to 50.
image := "image/blur,g_faces,r_25,s_50"
err = bucket.GetObjectToFile(sourceImageName, targetImageName, oss.Process(image))
if err != nil {
HandleError(err)
}
}Use the OSS API
If your business requires a high level of customization, you can directly call RESTful API operations. To directly call an API, you must include the signature calculation in your code. For more information about how to calculate the Authorization header, see (Recommended) Include a V4 signature in the Authorization header.
You can specify blur parameters in the GetObject operation to blur a private image. For more information, see GetObject.
GET /oss.jpg?x-oss-process=image/blur,g_faces,r_25,s_50 HTTP/1.1
Host: oss-example.oss-cn-hangzhou.aliyuncs.com
Date: Fri, 28 Oct 2022 06:40:10 GMT
Authorization: SignatureValueParameters
Action: blur
The following table describes the parameters that you can configure to blur an image.
Parameter | Required | Description | Valid value |
r | Yes | The blur radius. | [1,50] A greater value specifies a blurrier image. |
s | Yes | The standard deviation of a normal distribution. | [1,50] A greater value specifies a blurrier image. |
g | No | Specify the blur scope. |
Note
|
p | No | The parameter at which the blurred area is resized. | [1,200] Unit: %. Note This parameter takes effect only when g_face or g_faces is specified. |
Examples
References
You can add IMG operations directly to the URL of an image and use Cascading Style Sheets (CSS) to modify image styles and optimize the visual display of the processed image. The following sample code provides an example on how to use the IMG feature to blur an image and then use CSS to improve the visual effect of the processed image:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Blur Effect Example</title>
<style>
.blurred {
filter: blur(5px);
}
.container {
position: relative;
width: 300px;
}
.text {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: white;
font-size: 24px;
}
</style>
</head>
<body>
<div class="container">
<img src="https://oss-console-img-demo-cn-hangzhou-3az.oss-cn-hangzhou.aliyuncs.com/example1.jpg" alt="Sample Image" class="blurred">
<div class="text">Hello World</div>
</div>
<div>
<img src="https://oss-console-img-demo-cn-hangzhou-3az.oss-cn-hangzhou.aliyuncs.com/example1.jpg?x-oss-process=image%2Fblur%2Cr_10%2Cs_10&spm=a2c4g.11186623.0.i12">
</div>
</body>
</html>





