Настраиваем водяной знак (Watermark) на серверах NGINX

Nginx Apache

Столкнулся с проблемой при переезде на новый хостинг, на нем не стал обрабатываться Watermark (водяной знак). Поговорив с технической поддержкой выяснил, что данный хостинг использует связку Nginx+Apache.

Для веб-серверов, работающих в режиме двухуровневой конфигурация  Front-End (в нашем случае NGINX) и Back-End (Apache) скрипты "водяного знака" при правильной настройке обрабатываются следующим образом:

  1. пришедший в Front-End запрос обрабатывается по вышестоящему правилу location ~* /images\/.* { откуда проксируется на Back-End.
  2. Back-End подключает правило рерайта, которое мы прописали в файле .htacces для каталога /images и включает скрипт watermark
  3. После обработки Back-End'ом картинки, она "отдается"  Front-End'ом по нижестоящему правилу
location ~* ^.+\\.(jpg|jpeg|png|svg|exe|css|js|tft|sys|ini|mp3|ogg|mpe?g|avi|zip|gz|bz2?|rar)$ {

Таким образом сохраняется должная скорость отдачи сервером статического контента, используя функции Nginx и работает необходимый нам скрипт "водяного знака".

Приведу примеры кодов которые использовал на своем сайте и на сайте заказчика у которого установлен VirtueMart

Начнем с конфигуратора Nginx

server
{
	listen 78.***.***.89:80;
	server_name ваш_домен.ru www.ваш_домен.ru;
	rewrite ^(/manager/.*)$	https://$host$1	permanent;
	error_page 404 = @fallback;
	location ~* ^/(webstat/|awstats|webmail/|myadmin/|manimg/) {
		proxy_pass http://78.***.***.89:8080;
		proxy_redirect http://ваш_домен.ru:8080/ /;
		proxy_set_header Host $host;
		proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
		proxy_set_header X-Real-IP $remote_addr;
	}
	location / {
		proxy_pass http://78.***.***.89:8080;
		proxy_redirect http://ваш_домен.ru:8080/ /;
		proxy_set_header Host $host;
		proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
		proxy_set_header X-Real-IP $remote_addr;
	}
location ~* /images\/.* {
	proxy_pass http://78.***.***.89:8080;
	proxy_redirect http://ваш_домен.ru:8080/ /;
	proxy_set_header Host $host;
	proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
	proxy_set_header X-Real-IP $remote_addr;
}
	location ~* ^.+\\.(jpg|jpeg|png|svg|exe|css|js|tft|sys|ini|mp3|ogg|mpe?g|avi|zip|gz|bz2?|rar)$ {
		root /var/www/joomla/data/www/ваш_домен.ru;
		access_log /var/www/httpd-logs/ваш_домен.ru.access.log ;
		access_log /var/www/nginx-logs/art-joomla isp;
	}
	location @fallback {
		proxy_pass http://78.***.***.89:8080;
		proxy_set_header Host $host;
		proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
		proxy_set_header X-Real-IP $remote_addr;
	}
}

где в строке

location ~* /images\/.* {

указываем от корня сайта папку с изображениями, для интернет магазина работающем на VirtueMart - эта строка будет иметь вот такой вид:

location ~* /components/com_virtuemart/shop_image/product\/.* {

Подготавливаем картинку watermark.png с прозрачным фоном:

watermark

Подготавливаем файл watermark.php или скачиваем вложение, там все уже готово.

Содержимое файла watermark.php

<? 
waterMark($_SERVER['DOCUMENT_ROOT'].$_SERVER['REQUEST_URI'], "watermark.png", "bottom=30,right=30"); 

function waterMark($original, $watermark, $placement = 'bottom=30,right=30', $destination = null) { 
   $original = urldecode($original);
   $info_o = @getImageSize($original); 
   if (!$info_o) 
         return false; 
   $info_w = @getImageSize($watermark); 
   if (!$info_w) 
         return false; 

   list ($vertical, $horizontal) = split(',', $placement,2); 
   list($vertical, $sy) = split('=', trim($vertical),2); 
   list($horizontal, $sx) = split('=', trim($horizontal),2); 

   switch (trim($vertical)) { 
      case 'bottom': 
         $y = $info_o[1] - $info_w[1] - (int)$sy; 
         break; 
      case 'middle': 
         $y = ceil($info_o[1]/2) - ceil($info_w[1]/2) + (int)$sy; 
         break; 
      default: 
         $y = (int)$sy; 
         break; 
      } 

   switch (trim($horizontal)) { 
      case 'right': 
         $x = $info_o[0] - $info_w[0] - (int)$sx; 
         break; 
      case 'center': 
         $x = ceil($info_o[0]/2) - ceil($info_w[0]/2) + (int)$sx; 
         break; 
      default: 
         $x = (int)$sx; 
         break; 
      } 

   header("Content-Type: ".$info_o['mime']); 

   $original = @imageCreateFromString(file_get_contents($original)); 
   $watermark = @imageCreateFromString(file_get_contents($watermark)); 
   $out = imageCreateTrueColor($info_o[0],$info_o[1]); 

   imageCopy($out, $original, 0, 0, 0, 0, $info_o[0], $info_o[1]); 

//Тут задаем размер изображения в которые можно добавлять Watermark
// $info_o[0] > 250 - ширина изображения должна быть больше 250 px
// $info_o[1] > 250 - высота изображения должна быть больше 250 px

   if( ($info_o[0] > 250) && ($info_o[1] > 250) )
   {
   imageCopy($out, $watermark, $x, $y, 0, 0, $info_w[0], $info_w[1]);
   }

   switch ($info_o[2]) { 
      case 1: 
         imageGIF($out); 
         break; 
      case 2: 
         imageJPEG($out); 
         break; 
      case 3: 
         imagePNG($out); 
         break; 
         } 

   imageDestroy($out); 
   imageDestroy($original); 
   imageDestroy($watermark); 

   return true; 
   } 
?>

 Подготавливаем файл .htaccess его необходимо будет разместить в папке с картинками на которые необходимо накладывать watermark

Содержимое файла .htaccess

	RewriteEngine On
	RewriteCond %{REQUEST_FILENAME} -f
	RewriteRule ^(.*)$ /watermark/watermark.php [T=application/x-httpd-php,L,QSA]

 Заключение

Размещаем файлы на хостинге:

создаем в корне сайта папку watermark и закачиваем в нее 2 файла:

  1. watermark.php
  2. watermark.png

После всех манипуляций все должно заработать.

Есть возникнут вопросы добро пожаловать на форум

Вы здесь: Home Статьи Настраиваем водяной знак (Watermark) на серверах NGINX