Ganti ukuran gambar kanthi cepet nggunakake Nginx lan LuaJIT (OpenResty)

Kanggo sawetara wektu saiki, inspirasi dening artikel Ngowahi ukuran gambar ing fly ukuran gambar dikonfigurasi nggunakake ngx_http_image_filter_module lan kabeh makarya minangka ngirim. Nanging ana masalah nalika manajer kudu nampa gambar kanthi ukuran sing tepat kanggo diunggah menyang sawetara layanan, amarga ... iki padha syarat technical sing. Contone, yen kita duwe gambar asli ukuran 1200 Γ— 1200, lan nalika ngowahi ukuran kita nulis kaya ?resize=600Γ—400, banjur kita njaluk gambar suda proporsional ing pinggiran paling cilik, ukuran 400 Γ— 400. Sampeyan uga ora bisa njupuk gambar kanthi resolusi sing luwih dhuwur (upscale). Sing. ?resize=1500Γ—1500 bakal ngasilake gambar sing padha 1200 Γ— 1200

Artikel iki teka kanggo ngluwari OpenResty: ngowahi NGINX dadi server aplikasi lengkap kanggo mangerteni carane Nginx bisa digunakake karo Lua lan perpustakaan dhewe kanggo Lua isage / lua-imagick - Lua pure-c bindings kanggo ImageMagick. Napa solusi iki dipilih, lan ora, ujar, soko python - amarga cepet lan trep. Sampeyan ora perlu nggawe file apa wae, kabeh ana ing konfigurasi Nginx (opsional).

Dadi apa sing kita butuhake

Conto bakal diwenehi adhedhasar Debian.

Nginstal nginx lan nginx-ekstra

apt-get update
apt-get install nginx-extras

Nginstal LuaJIT

apt-get -y install lua5.1 luajit-5.1 libluajit-5.1-dev

Nginstal imagemagic

apt-get -y install imagemagick

lan perpustakaan sulap kanggo iku, ing kasusku kanggo versi 6

apt-cache search libmagickwand
apt-get -y install libmagickwand-6.q16-3 libmagickwand-6.q16-dev

Bangunan lua-imagick

Kita kloning repositori (utawa njupuk zip lan mbongkar)

cd ~
git clone https://github.com/isage/lua-imagick.git
cd lua-imagick
mkdir build
cd build
cmake ..
make
make install

Yen kabeh wis apik, sampeyan bisa ngatur Nginx.

Aku bakal menehi conto config saka host backend, kang, ing kasunyatan, tanggung jawab kanggo ngowahi ukuran. Iki diproksi dening server ngarep, uga karo Nginx, ing ngendi caching dumadi sajrone wektu tartamtu (dina) lan liya-liyane.

nginx backend config

# Backend image server
server {
    listen       8082;
    listen [::]:8082;
    set $files_root /var/www/example.lh/frontend/web;
    root $files_root;
    access_log off;
    expires 1d;

    location /files {
        # Π΄Π΅Ρ„ΠΎΠ»Ρ‚Π½Ρ‹Π΅ значСния рСсайза
        set $w 700;
        set $h 700;
        set $q 89;

        #1-89 allowed
        if ($arg_q ~ "^([1-9]|[1-8][0-9])$") {
            set $q $arg_q;
        }

        if ($arg_resize ~ "([d-]+)x([d+!^]+)") {  
            set $w $1;
            set $h $2;
            rewrite  ^(.*)$   /resize/$w/$h/$q$uri     last;
        }

        rewrite  ^(.*)$   /resize/$w/$h/$q$uri     last;
    }

    location ~* ^/resize/([d]+)/([d+!^]+)/([d]+)/files/(.+)$ {
        default_type 'text/plain';

        set $w $1;
        set $h $2;
        set $q $3;
        set $fname $4;

        # Π•ΡΡ‚ΡŒ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡ‚ΡŒ вынСсти вСсь Lua ΠΊΠΎΠ΄ Π² ΠΎΡ‚Π΄Π΅Π»ΡŒΠ½Ρ‹ΠΉ Ρ„Π°ΠΉΠ»
        # content_by_lua_file /var/www/some.lua;
        # lua_code_cache off; #dev
        content_by_lua '
        local magick = require "imagick"
        local img = magick.open(ngx.var.files_root .. "/files/" .. ngx.var.fname)
        if not img then ngx.exit(ngx.HTTP_NOT_FOUND) end
        img:set_gravity(magick.gravity["CenterGravity"])

        if string.match(ngx.var.h, "%d+%+") then
            local h = string.gsub(ngx.var.h, "(%+)", "")
            resize = ngx.var.w .. "x" .. h
            -- для png с Π°Π»ΡŒΡ„Π° ΠΊΠ°Π½Π°Π»ΠΎΠΌ
            img:set_bg_color(img:has_alphachannel() and "none" or img:get_bg_color())
            img:smart_resize(resize)
            img:extent(ngx.var.w, h)
        else
                img:smart_resize(ngx.var.w .. "x" .. ngx.var.h)
        end

        if ngx.var.arg_q then img:set_quality(ngx.var.q) end

        ngx.say(img:blob())
        ';
    }
}

# Upstream
upstream imageserver {
    server localhost:8082;
}

server {
    listen 80;
    server_name examaple.lh;

    # отправляСм всС jpg ΠΈ png ΠΊΠ°Ρ€Ρ‚ΠΈΠ½ΠΊΠΈ Π½Π° imageserver
    location ~* ^/files/.+.(jpg|png) {
        proxy_buffers 8 2m;
        proxy_buffer_size 10m;
        proxy_busy_buffers_size 10m;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;

        proxy_pass     http://imageserver;  # Backend image server
    }
}

Apa sing dibutuhake (ngembangake gambar ing pinggir) kedadeyan nggunakake img:extent() lan ditetepake nggunakake parameter resize kanthi tandha + ing pungkasan.

Pilihan ing ngisor iki kasedhiya:

  • WxH (Tetep rasio aspek, gunakake ukuran sing luwih dhuwur)
  • WxH^ (Tetep rasio aspek, gunakake ukuran ngisor (potong))
  • WxH! (Abaikan rasio aspek)
  • WxH+ (Tetep rasio aspek, tambahake wates sisih)

Tabel ringkesan kanthi asil pangowahan ukuran

Njaluk parameter uri
Ukuran Gambar Output

?resize=400Γ—200
200 Γ— 200

?resize=400Γ—200^
400 Γ— 400

?resize=400Γ—200!
400Γ—200 (Ora proporsional)

?resize=400Γ—200+
400Γ—200 (Proporsional)

Ganti ukuran gambar kanthi cepet nggunakake Nginx lan LuaJIT (OpenResty)

Asile

Ngelingi kekuwatan lan kesederhanaan pendekatan iki, sampeyan bisa ngetrapake samubarang kanthi logika sing cukup rumit, umpamane, nambahake watermark utawa ngetrapake wewenang kanthi akses winates. Kanggo ngerteni kemampuan API kanggo nggarap gambar, sampeyan bisa ngrujuk menyang dokumentasi perpustakaan isage / lua-imagick

Source: www.habr.com

Add a comment