Nginx 및 LuaJIT(OpenResty)를 사용하여 즉시 이미지 크기 조정

꽤 오랫동안, 기사에서 영감을 받았습니다. 즉석에서 이미지 크기 조정 이미지 크기 조정은 다음을 사용하여 구성되었습니다. ngx_http_image_filter_module 그리고 모든 것이 제대로 작동했습니다. 하지만 관리자가 일부 서비스에 업로드하기 위해 정확한 크기의 이미지를 받아야 할 때 하나의 문제가 발생했습니다. 이는 해당 서비스의 기술적 요구 사항이었기 때문입니다. 예를 들어, 원본 이미지 크기가 있는 경우 1200 × 1200, 그리고 크기를 조정할 때 우리는 다음과 같이 씁니다. ?크기 조정=600×400그러면 우리는 가장 작은 가장자리를 따라 비례적으로 축소된 이미지를 얻습니다. 400 × 400. 더 높은 해상도(업스케일)의 이미지를 얻는 것도 불가능합니다. 저것들. ?크기 조정=1500×1500 모두 동일한 이미지를 반환합니다 1200 × 1200

기사가 구해줬어요 OpenResty: NGINX를 본격적인 애플리케이션 서버로 전환 Nginx가 Lua와 Lua 자체 라이브러리와 어떻게 작동하는지 이해하려면 이사지/루아-이매직 - ImageMagick에 Lua pure-c 바인딩을 적용합니다. 왜 파이썬이 아닌 이 솔루션을 선택했을까요? 빠르고 편리하기 때문입니다. 아무 파일도 만들 필요도 없고, 모든 것이 Nginx 설정에 들어있습니다(필수 아님).

그러면 우리에게 필요한 것은 무엇일까?

예시는 다음을 기준으로 제시됩니다. Debian.

nginx 및 nginx-extras 설치

apt-get update
apt-get install nginx-extras

LuaJIT 설치

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

Imagemagick 설치

apt-get -y install imagemagick

그리고 도서관 요술봉 내 경우에는 버전 6에 대해서요

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

lua-imagick 빌드

저장소를 복제합니다(또는 zip 파일을 가져와 압축을 풉니다)

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

모든 것이 원활하게 진행되면 Nginx를 구성할 수 있습니다.

실제로 크기 조정을 처리하는 백엔드 호스트 구성의 예를 들어보겠습니다. Nginx를 탑재한 프런트 서버로 프록시를 구성하여 특정 기간(하루) 동안 캐싱을 수행하고 기타 작업을 수행합니다.

nginx 백엔드 설정

# 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
    }
}

요구된 작업(가장자리 이미지 확장)은 다음의 도움으로 수행됩니다. img:extent() 매개변수를 사용하여 정의됩니다. resize 서명 + 끝에.

다음과 같은 옵션을 사용할 수 있습니다.

• WxH (종횡비 유지, 더 높은 차원 사용)
• WxH^ (종횡비 유지, 더 낮은 차원 사용(자르기))
• 가로x세로! (종횡비 무시)
• WxH+ (종횡비 유지, 측면 테두리 추가)

크기 조정 결과가 포함된 요약 표

요청 uri 매개변수
출력 이미지 크기

?크기 조정=400×200
200 × 200

?크기 조정=400×200^
400 × 400

?크기 조정=400×200!
400×200 (비례하지 않음)

?크기 조정=400×200+
400×200(비례)

합계

이 접근 방식의 강력함과 단순성을 고려하면 워터마크를 추가하거나 제한된 액세스로 권한을 부여하는 등 상당히 복잡한 논리를 구현할 수 있습니다. 이미지 작업을 위한 API 기능에 대해 알아보려면 라이브러리 문서를 참조하세요. 이사지/루아-이매직

출처 : habr.com