Масштабирование изображений в CMS

Цель учебного пособия

Вы научитесь тому, как CMS bluetronix масштабирует локальные изображения через IMG.pl во время процесса рендеринга сайта в CMS, какие шесть параметров используется в вызове и почему браузер затем получает только готовый файл изображения.

CMS bluetronix имеет:

IMG.pl

центральную функцию автоматического масштабирования и обработки изображений.

IMG.pl используется внутри CMS для автоматического обрезания и масштабирования изображений до желаемого размера во время процесса рендеринга сайта в CMS.

Важно: IMG.pl является внутренней функцией CMS bluetronix. Вызов IMG.pl не будет передан пользователю как конечный URL изображения.

Основной принцип

Внутри HTML-кода сначала может быть использован внутренний вызов IMG.pl.

Пример:

<img src="/CMS/cgi-bin/IMG.pl?/img/image.jpg=700=500=1=100=1">

В процессе рендеринга сайта CMS этот вызов обрабатывается.

CMS один раз генерирует соответствующий масштабированный файл изображения.

Затем первоначальный вызов IMG.pl заменяется на имя готового файла изображения.

Код перед рендерингом

<img src="/CMS/cgi-bin/IMG.pl?/img/image.jpg=700=500=1=100=1">

Код после рендеринга

После обработки HTML-код может выглядеть, например, так:

<img src="/tmp/img_image_700_500_1_100_1_1070.jpg">

Браузер получает не первоначальный вызов IMG.pl, а напрямую уже сгенерированный файл изображения.

Процесс рендеринга сайта в CMS

HTML enthält IMG.pl-Aufruf
      ↓
CMS-Site-Rendering-Prozess
      ↓
IMG.pl wird intern verarbeitet
      ↓
Bild wird skaliert / zugeschnitten
      ↓
neue Bilddatei wird erzeugt
      ↓
IMG.pl-Aufruf wird ersetzt
      ↓
fertiger Bild-Dateiname wird in das HTML eingesetzt
      ↓
fertige HTML-Seite wird ausgeliefert

Таким образом, масштабирование изображения не нужно выполнять заново при каждом вызове браузера.

IMG.pl используется только внутренне

Важно: IMG.pl предназначен исключительно для внутреннего использования в рамках CMS bluetronix.

IMG.pl не должен использоваться в качестве внешнего интерфейса для изображений или вызываться напрямую с внешних веб-сайтов.

Обработка происходит внутри во время процесса рендеринга.

На внешний уровень поставляется исключительно готовый файл изображения.

Изображения должны быть доступны на веб-пространстве

Важно: Все изображения, обрабатываемые через IMG.pl, должны находиться непосредственно на веб-пространстве соответствующей установки bluetronix.

Внешние URL изображений не могут быть использованы в качестве исходного файла.

Допустимо, например:

/img/image.jpg

Не предусмотрено, например:

https://external-domain.com/image.jpg

Исходный файл должен быть доступен локально в пределах веб-пространства.

Структура вызова IMG.pl

Типичный вызов выглядит так:

<img src="/CMS/cgi-bin/IMG.pl?/img/image.jpg=700=500=1=100=1">

Параметры задаются непосредственно друг за другом с:

=

разделители.

Имена параметров не используются.

Ключевым является только порядок параметров.

Обзор параметров

Параметр 1 – Имя файла

Первый параметр содержит путь к исходному файлу.

Пример:

/img/image.jpg

Внутренне этот параметр соответствует:

my $f = $help[0];

Если указанный исходный файл не существует, обработка будет завершена.

Примечание: Без действительного локального исходного файла IMG.pl не может создать изображение.

Параметр 2 – Ширина

Второй параметр определяет желаемую ширину изображения в пикселях.

Пример:

700

Внутренне:

my $w = $help[1];

Параметр 3 – Высота

Третий параметр определяет желаемую высоту изображения в пикселях.

Пример:

500

Внутренне:

my $h = $help[2];

Параметр 4 – Пропорциональность

Четвертый параметр управляет пропорциональным масштабированием или обрезкой изображения.

Пример:

1

Внутренне:

my $p = $help[3];

Таким образом, можно контролировать, как исходное соотношение сторон изображения обрабатывается при масштабировании или обрезке.

Параметр 5 – Качество

Пятый параметр определяет качество создаваемого файла изображения для обычных растровых изображений.

Пример:

100

Внутренне:

my $q = $help[4];

Как правило, это значение устанавливается на:

100

установлено.

Параметр 6 – Масштабирование

Шестой параметр управляет тем, может ли изображение увеличиваться, если желаемый размер вывода больше оригинального изображения.

Внутренне:

my $z = $help[5];

С помощью:

1

изображение будет увеличено при необходимости.

Пример:

...=700=500=1=100=1

Без активированного масштабирования слишком маленькое изображение не будет масштабировано соответствующим образом. Вместо этого оставшееся пространство будет заполнено белой рамкой или фоном.

Пример с шестью параметрами

/CMS/cgi-bin/IMG.pl?/img/image.jpg=700=500=1=100=1

Значения означают:

1. /img/image.jpg
   → Quelldatei

2. 700
   → Breite: 700 Pixel

3. 500
   → Höhe: 500 Pixel

4. 1
   → proportionale Verarbeitung / Zuschnitt

5. 100
   → Bildqualität

6. 1
   → Zoom aktiviert

Допустимые типы файлов

IMG.pl поддерживает следующие форматы изображений:

gif
jpg
jpe
jpeg
png
svg

Особенности файлов SVG

У файлов SVG пятый параметр имеет особое значение.

Для обычных форматов изображений, таких как JPG или PNG, это:

my $q = $help[4];

качество изображения.

Для файлов SVG этот параметр используется в качестве цвета.

Примечание: $help[4] технически является пятым переданным параметром, так как внутренний массив начинается с индекса 0.

Таким образом,

JPG / PNG / GIF
Parameter 5
→ Qualität


SVG
Parameter 5
→ Farbe

при обработке файла SVG можно установить или заменить требуемый цвет.

Внутренний сопоставление параметров

Внутри шесть переданных значений обрабатываются следующим образом:

my $f = $help[0];  # Dateiname
my $w = $help[1];  # Breite
my $h = $help[2];  # Höhe
my $p = $help[3];  # Proportionalität
my $q = $help[4];  # Qualität / bei SVG: Farbe
my $z = $help[5];  # Zoom

Почему IMG.pl заменяется при рендеринге?

Внутренний вызов IMG.pl не предназначен как постоянный публичный URL для изображения.

Вместо этого он служит CMS в качестве инструкции:

Nimm dieses Bild
+
erzeuge diese Größe
+
verwende diese Skalierung
+
verwende diese Qualität
+
berücksichtige die Zoom-Einstellung

Результат затем сохраняется как обычный файл изображения.

Из:

<img src="/CMS/cgi-bin/IMG.pl?/img/image.jpg=700=500=1=100=1">

становится, например:

<img src="/tmp/img_image_700_500_1_100_1_1070.jpg">

Таким образом, браузер получает только готовый файл.

Преимущества масштабирования изображений в CMS

Централизованная масштабировка изображения предлагает несколько преимуществ:

• einheitliche Bildgrößen
• automatischer Bildzuschnitt
• keine manuelle Erstellung jeder einzelnen Bildgröße erforderlich
• fertige Bilddateien können direkt ausgeliefert werden
• IMG.pl muss nicht als öffentliche Bildschnittstelle verwendet werden
• die Bildverarbeitung wird zentral vom CMS gesteuert

Резюме

IMG.pl является центральной внутренней функцией масштабирования изображений CMS bluetronix.

Типичный вызов выглядит так:

<img src="/CMS/cgi-bin/IMG.pl?/img/image.jpg=700=500=1=100=1">

Шесть параметров:

1. Dateiname
2. Breite
3. Höhe
4. Proportionalität
5. Qualität / bei SVG Farbe
6. Zoom

Важно:

Quelldateien müssen lokal auf dem Webspace liegen.

IMG.pl ist nur für die interne CMS-Verarbeitung vorgesehen.

IMG.pl-Aufrufe werden während des Rendering-Prozesses verarbeitet.

Nach außen wird die fertig erzeugte Bilddatei ausgeliefert.

Основной процесс выглядит следующим образом:

lokales Originalbild
      ↓
IMG.pl
      ↓
Skalierung / Zuschnitt
      ↓
fertige Bilddatei erzeugen
      ↓
IMG.pl-Aufruf im HTML ersetzen
      ↓
fertige Bild-URL an den Browser ausliefern