Добавить водяной знак к изображениям

Question

Я искал решение целую вечность, но не могу найти решение, которое бы соответствовало моим потребностям.

Итак, вот история.Я создаю веб-сайт, и я действительно хочу добавить водяные знаки к загруженным изображениям.

Вчера я просматривал веб-сайт под названием 9gag.Если вы раньше не слышали этот веб-сайт, это комический веб-сайт, и я обнаружил, что когда вы загружаете изображение или получаете доступ к изображению где-либо еще, кроме их веб-сайта, в нижней частиimage.

Например, возьмите это изображение: ссылка , обратите внимание на отсутствие баннера внизу изображения.

Если вы щелкнете правой кнопкой мыши, «Копировать URL изображения»,Вы получаете эту ссылку: изображение .Видите баннер сейчас?

Я очень смущен тем, как они это делают, и было бы здорово, если бы мы могли использовать это на наших сайтах.

У кого-нибудь есть идеи?Используется ли какой-либо тип CGI?

PS: Я не был уверен, какие теги добавить, поэтому, если кто-нибудь знает лучшую комбинацию тегов, пожалуйста, отредактируйте ее.

Answer 1

Этот эффект просто трюк cssСамо изображение фактически содержит водяной знак внизу, но тег изображения обернут в блок, который скрывает (переполнение: скрытый) нижние 42 пикселя изображения, когда оно отображается на странице.

Естьдругие вещи, которые вы можете сделать более сложные (например, отправить изображение через скрипт php и сравнить http referer

header("content-type: image/jpeg");
if (!isset($_SERVER['HTTP_REFERER'])){die("alert('Restricted Access!');");};
$_u=parse_url($_SERVER['HTTP_REFERER']);
$_u=preg_replace("/(www.)/i","",strtolower($_u['host']));
$_i=$_SERVER['HTTP_HOST'];
$_i=preg_replace("/(www.)/i","",strtolower($_i));
if ($_u != $_i){
   //handle this with gd or redirect
}

), но это будет работать, только если кто-то попытается загрузить изображение издругой веб-сайт или, если они переходят по URL-адресу изображения ... обычно save-as будет сохранять изображение из кэша браузера, поэтому трюк css может быть лучшим вариантом, который у вас есть (или комбинация этих параметров).Имейте в виду, что все, что вы показываете в Интернете, может быть захвачено (код выше не является надежным, и вы всегда можете prtsc).

Answer 2

GD библиотека php поможет вам в этом.

1. Вам нужно будет создать новое изображение, используя функцию imagecreate , но добавив немного «пробела» к исходному размеру. Пример: если у меня есть изображение размером 200x200 (которое вы также можете получить с помощью функций gd), вам нужно создать изображение размером 200x220 пикселей, используя эту функцию

2. Заполните новое изображение этим серым цветом, используя imagefilledrectangle function

3. Скопируйте исходное изображение в новое, используя imagecopy

4. Установите тип содержимого заголовка: image / type png gif и т. Д.

5. Вывод на изображение с использованием imagepng или любой другой функции в нужном формате.

Answer 3

У меня был успех с JQuery Watermark: Jquery Watermark