Alibaba Cloud OSS は、非常に大きな処理能力、高度なセキュリティ、低いコスト、高い信頼性を誇る、画像処理サービスを提供します。
ソース画像を OSS にアップロードして保存しておくことで、いつでもどこでも、あらゆるインターネットデバイスから、シンプルな RESTful インターフェイスを使用して画像を処理できます。
画像処理サービスでは、画像処理インターフェイスが利用できます。画像のアップロードは、OSS のアップロードインターフェイスを使用してください。OSS の画像処理をベースにして独自の画像処理サービスを構築できます。
画像処理の基本機能
OSS 画像処理は、次の機能を備えています。
画像情報の取得
画像の形式の変換
画像効果
画像ウォーターマーク、テキストウォーターマーク、およびテキストと画像の両方で構成されるウォーターマークの追加
コンソールの [Image Processing] > [Manage Styles] で定義される画像処理スタイルのカスタマイズ
カスケード処理による複数の画像処理機能の呼び出し
画像処理の使用方法
画像処理では、アクセスに標準の HTTP GET
要求を使用します。すべての処理パラメーターは、URL
内で QueyString でエンコードされます。
匿名アクセス
次の表に示されているように、画像オブジェクトのアクセス権限が公開読み取りである場合、匿名で画像処理にアクセスできます。
バケットの権限 | オブジェクトの権限 |
---|---|
公開読み取りまたは 公開読み書き |
デフォルト |
すべての権限 | 公開読み取りまたは 公開読み書き |
次の形式でサードレベルドメインを使用して匿名で画像処理にアクセスします。
http://bucket.<endpoint>/object?x-oss-process=image/action,parame_value
Bucket: ユーザーのバケットの名前
Endpoint: ユーザーのバケットのデータセンターに必要なアクセスドメイン名
Object: OSS にアップロードされた画像オブジェクト
Image: 画像処理で予約されている識別子
Action: 画像に対する操作 (拡大縮小、トリミング、回転など)
Parame: 画像に対する操作に対応するパラメーター
例:
http://image-demo.oss-cn-hangzhou.aliyuncs.com/example.jpg?x-oss-process=image/resize,w_100
カスタムスタイル。次の形式でサードレベルドメインを使用して匿名で画像処理にアクセスします。
http://bucket.<endpoint>/object?x-oss-process=x-oss-process=style/name
- Style: ユーザーのカスタムスタイル用にシステムによって予約された識別子
Name: カスタムスタイルの名前、つまりコンソール定義スタイルのルール名
例:
http://image-demo.oss-cn-hangzhou.aliyuncs.com/example.jpg?x-oss-process=style/oss-pic-style-w-100
イメージサービスのアクセスルールを使用すると、イメージに複数の操作を実装できます。形式は次のとおりです。
http://bucket.<endpoint>/object?x-oss-process=image/action,parame_value/action,parame_value/...
例:
http://image-demo.oss-cn-hangzhou.aliyuncs.com/example.jpg?x-oss-process=image/resize,w_100/rotate,90
画像処理は HTTPS アクセスにも対応しています。
例:
https://image-demo.oss-cn-hangzhou.aliyuncs.com/example.jpg?x-oss-process=image/resize,w_100
権限付与済みアクセス
次の表に示されているように、非公開権限のオブジェクトの場合、画像処理にアクセスするには権限が付与されている必要があります。
バケットの権限 | オブジェクトの権限 |
---|---|
非公開 | デフォルト |
すべての権限 | 非公開 |
署名を使って生成された画像処理の URL コードは次のとおりです。
var OSS = require('ali-oss');
var client = new OSS({
accessKeyId: '<accessKeyId>',
accessKeySecret: '<accessKeySecret>',
bucket: '<bucketName>',
Endpoint: '<endpoint, such as http://oss-cn-hangzhou.aliyuncs.com>'
});
// Expired for 10 minutes. The image processing style is: "image/resize,w_300".
var signUrl = client.signatureUrl('example.jpg', {expires: 600, 'process' : 'image/resize,w_300'});
console.log("signUrl="+signUrl);
注意:
権限付与済みアクセスは、カスタムスタイル、HTTPS、およびカスケード処理に対応しています。
有効期限 (expires) は秒単位で測定されます。
SDK アクセス
直接 SDK を使用して、任意の権限の画像オブジェクトにアクセスして処理できます。
注意: SDK による画像オブジェクトの処理は、カスタムスタイル、HTTPS、およびイメージサービスのアクセスルール.に対応しています。
基本操作
画像処理の基本操作には、ドミナントトーンの取得、形式の変換、イメージのサイズ変更、内接円、向きの調整、輝度、およびウォーターマークの追加があります。
var OSS = require('ali-oss');
var co = require('co');
var client = new OSS({
accessKeyId: '<accessKeyId>',
accessKeySecret: '<accessKeySecret>',
bucket: '<bucketName>',
Endpoint: '<endpoint, such as http://oss-cn-hangzhou.aliyuncs.com>'
});
// Scale
co(function* () {
var result = yield client.get('example.jpg', './example-resize.jpg',
{process: 'image/resize,m_fixed,w_100,h_100'});
}).catch(function (err) {
console.log(err);
});
// Crop
co(function* () {
var result = yield client.get('example.jpg', './example-crop.jpg',
{process: 'image/crop,w_100,h_100,x_100,y_100,r_1'});
}).catch(function (err) {
console.log(err);
});
// Rotate
co(function* () {
var result = yield client.get('example.jpg', './example-rotate.jpg',
{process: 'image/rotate,90'});
}).catch(function (err) {
console.log(err);
});
// Sharpen
co(function* () {
var result = yield client.get('example.jpg', './example-sharpen.jpg',
{process: 'image/sharpen,100'});
}).catch(function (err) {
console.log(err);
});
// Watermark
co(function* () {
var result = yield client.get('example.jpg', './example-watermark.jpg',
{process: 'image/watermark,text_SGVsbG8g5Zu-54mH5pyN5YqhIQ'});
}).catch(function (err) {
console.log(err);
});
// Format conversion
co(function* () {
var result = yield client.get('example.jpg', './example-format.jpg',
{process: 'image/format,png'});
}).catch(function (err) {
console.log(err);
});
// Image information
co(function* () {
var result = yield client.get('example.jpg', './example-info.txt',
{process: 'image/info'});
}).catch(function (err) {
console.log(err);
});
カスタムスタイル
注意: カスタムスタイルを使用する前に、OSS コンソールに移動して、カスタムスタイル example-sytle を追加してください。
var OSS = require('ali-oss');
var co = require('co');
var client = new OSS({
accessKeyId: '<accessKeyId>',
accessKeySecret: '<accessKeySecret>',
bucket: '<bucketName>',
Endpoint: '<endpoint, such as http://oss-cn-hangzhou.aliyuncs.com>'
});
// Custom styles
co(function* () {
var result = yield client.get('example.jpg', './example-custom-style.jpg',
{process: 'style/example-sytle"'});
}).catch(function (err) {
console.log(err);
});
カスケード処理
var OSS = require('ali-oss');
var co = require('co');
var client = new OSS({
accessKeyId: '<accessKeyId>',
accessKeySecret: '<accessKeySecret>',
bucket: '<bucketName>',
Endpoint: '<endpoint, such as http://oss-cn-hangzhou.aliyuncs.com>'
});
// Cascading processing
co(function* () {
var result = yield client.get('example.jpg', './example-cascade.jpg',
{process: 'image/resize,m_fixed,w_100,h_100/rotate,90'});
}).catch(function (err) {
console.log(err);
});
画像処理ツール
可視化された画像処理ツール ImageStyleViever を使用すると、OSS の画像処理の結果をわかりやすく表示できます。
OSS 画像処理機能および使用方法のデモンストレーションページに移動するには、ここをクリックしてください。