ESA Fungsi Edge memungkinkan Anda fetch sumber daya gambar dalam kode. Dengan menambahkan parameter, Anda dapat memproses gambar di ESA dan menyimpan gambar yang telah diproses dalam cache.
Parameter
Berikut adalah daftar parameter pemrosesan gambar yang didukung oleh Fungsi Edge:
format: Mengonversi format gambar.quality: Mengubah kualitas gambar.crop: Memotong gambar dengan ukuran tertentu.resize: Mengubah ukuran gambar.rotate: Memutar gambar berdasarkan parameter orientasi atau searah jarum jam sesuai sudut yang ditentukan.colorGrading: Menyesuaikan kecerahan, kontras, dan ketajaman gambar.waterMark: Menambahkan watermark gambar atau teks ke gambar.info: Meminta informasi gambar, termasuk lebar, tinggi, format, dan kualitas.
Penggunaan
Format pemrosesan gambar adalah sebagai berikut:
image: menunjukkan bahwa sumber daya gambar yang diambil perlu dikonversi. Ini adalahArray. Anda dapat mengonfigurasi beberapa tindakan pemrosesan.action: Tindakan spesifik yang akan dilakukan.option: Parameter yang diperlukan untuk tindakan.mode: Beberapaactionmemiliki mode yang berbeda. Bidang ini menunjukkan mode mana yang diperlukan.param: Parameter pemrosesan yang harus ditentukan.
return fetch(imageUrl, {
image: [
{
action: "xxx",
option: {
mode: "xxx",
param: {
},
},
},
{
action: "xxx",
option: {
mode: "xxx",
param: {
},
},
},
],
});
}Contoh
Format
Mentransformasi format gambar.
async function imageFormat() {
return fetch(imageUrl1, {
image: [
{
action: "format",
option: {
param: {
f: "png",
},
},
},
],
});
}actiontidak memerlukan penentuanmode.paramjenis yang didukung.f
Hanya format gambar berikut yang didukung:
JPEG, PNG, WebP, BMP, GIF, TIFF, dan JPEG 2000.Untuk informasi lebih lanjut tentang format, lihat Konversi format gambar.
Kualitas
Mentransformasi kualitas gambar.
async function imageQuality() {
return fetch(imageUrl1, {
image: [
{
action: "quality",
option: {
param: {
Q: 5,
},
},
},
],
});
}actiontidak memerlukan penentuanmode.paramjenis yang didukung.QNilainya harus kelipatan 5 antara 0 dan 100.
Untuk informasi lebih lanjut, lihat Sesuaikan kualitas gambar.
qNilainya harus kelipatan 5 antara 0 dan 100.
Untuk informasi lebih lanjut, lihat Sesuaikan kualitas gambar.
Potong
Contoh 1: Potongan lingkaran
async function imageCrop() {
return fetch(imageUrl1, {
image: [
{
action: "crop",
option: {
mode: "circle",
param: {
r: 100,
},
},
},
],
});
}Contoh 2: Potongan tengah
async function imageCrop() {
return fetch(imageUrl1, {
image: [
{
action: "crop",
option: {
mode: "mid",
param: {
w: 400,
h: 200,
},
},
},
],
});
}action:modemendukungparamberikut. Untuk informasi lebih lanjut, lihat Potong gambar.circle: Potongan lingkaran.sudoku: Potongan sudoku.coordinate: Pemotongan dilakukan berdasarkan koordinat X dan Y.mid: Potongan tengah.
circleratauRNilainya harus bilangan bulat yang lebih besar dari 0.
Deskripsi: Menentukan jari-jari garis singgung lingkaran.
sudokugNilai valid:
[nw, north, ne, west, center, east, sw, south, se]Deskripsi: Sesuai dengan sembilan posisi dalam sudoku.
wNilai valid:
0hingga16777216.Deskripsi: Menentukan lebar pemotongan.
hNilai valid:
0hingga16777216.Deskripsi: Menentukan tinggi pemotongan.
coordinatexNilai valid:
0hingga16777216.Deskripsi: Menentukan koordinat x titik awal pemotongan.
yNilai valid:
0hingga16777216.Deskripsi: Menentukan koordinat y titik awal pemotongan.
wNilai valid:
0hingga16777216.Deskripsi: Menentukan lebar pemotongan.
hNilai valid:
0hingga16777216.Deskripsi: Menentukan tinggi pemotongan.
midwNilai valid:
0hingga16777216.Deskripsi: Menentukan lebar pemotongan.
hNilai valid:
0hingga16777216.Deskripsi: Menentukan tinggi pemotongan.
Putar
Contoh 1: Rotasi kustom
async function imageRotate() {
return fetch(imageUrl1, {
image: [
{
action: "rotate",
option: {
mode: "custom",
param: {
a: 180,
},
},
},
],
});
}Contoh 2: Rotasi otomatis
async function imageRotate() {
return fetch(imageUrl1, {
image: [
{
action: "rotate",
option: {
mode: "auto",
param: {
},
},
},
],
});
}modemendukungparamberikut. Untuk informasi lebih lanjut, lihat Rotasi gambar.CUSTOM: Rotasi kustom.auto: Rotasi otomatis.
customaatauANilai valid:
90,180,270Deskripsi: Menentukan sudut rotasi.
auto: Rotasi otomatis tanpa menentukan parameter.
Ubah Ukuran
Mengubah ukuran gambar.
async function imageResize() {
return fetch(imageUrl1, {
image: [
{
action: "resize",
option: {
mode: "custom",
param: {
p: 90,
// s: 200,
// l: 200,
// w: 200,
// h: 200,
fw: 200,
// fh: 200,
},
},
},
],
});
}actionsaat ini hanya mendukung satumode, yang secara default ditulis sebagaicustom. Parameterparamberikut didukung:customl,s,w,h,fw,fhNilai valid:
0hingga16777216.Untuk informasi lebih lanjut, lihat Ubah ukuran gambar.
pNilai valid:
0hingga100.Untuk informasi lebih lanjut, lihat Ubah ukuran gambar.
Penyesuaian Warna
Menyesuaikan kecerahan, kontras, dan efek ketajaman gambar.
async function imageColorGrading() {
return fetch(imageUrl1, {
image: [
{
action: "colorGrading",
option: {
param: {
b: -100,
c: 10,
s: 50,
},
},
},
],
});
}action, Anda tidak perlu menentukanmode. Parameterparamberikut didukung. Untuk informasi lebih lanjut, lihat Warna gambar.bNilai valid:
-100hingga100.Deskripsi: Persentase penyesuaian kecerahan gambar yang diinginkan.
cNilai valid:
-100hingga100.Deskripsi: Persentase penyesuaian kontras gambar yang diinginkan.
sNilai valid:
50hingga399.Deskripsi: Ketajaman gambar.
Watermark
Menambahkan watermark teks dan watermark gambar.
async function imageWaterMark() {
return fetch(imageUrl1, {
image: [
{
action: "waterMark",
option: {
mode: "text",
param: {
text: "bW9jaGVuIHRlc3Q",
x: 10,
y: 10,
rotate: 100,
},
},
},
{
action: "waterMark",
option: {
mode: "image",
param: {
image:
"aHR0cHM6Ly9jZG4yLmljb25maW5kZXIuY29tL2RhdGEvaWNvbnMvc29jaWFsLW1lZGlhLTIxODkvNDgvMTMtT3BlcmEtMTI4LnBuZw",
g: 3,
},
},
},
],
});
}