Способ защитить свои картинки от кражи

@c4boomb · Регистрация: 20.04.2011

Студворк — интернет-сервис помощи студентам

Когда-то, лет шесть назад я играл в travian.ru . Меня заинтересовали их красочные картинки. Я как обычно правый клик -> сохранить изображение как -> сохранить. Захожу в папку, файл с именем x.png , открываю, вижу пустоту. Пробую сохранить другую картинку, в папке опять x.png, пустой. Тут я и понял, что на сервере защита.
Сначала я подумал, что это из области php, но сразу отбросил эту мысль, поняв, что на php такого не сделать. Далее я подумал на яву, но просмотрев скрипты к которым обращается страничка, понял, что ява сдесь не при чём! И тут оставался только CSS, смотрю я файлик с главной странички(обсолютно не читаемый код) http://www.travian.ru/gpack/ma... t.css?929t .

CSS
1
div#popup div.currentServer div.serverBigNewSw{background-image:url(../../img/server/newBigSw-ltr.jpg);}

Вот оно!

Теперь для тех кто не понял как это работает.
вот:

HTML5
1
<div id="k1"><img src="0.png" /></div>

Стили к этому файлу

CSS
1
2
3
#k1{
  background: url('kartinka.png');
}

0.png - пустая, прозрачная(!!!!), картинка.
kartinka.png - целевая картинка.

Стили CSS на фон пихают нашу картинку, затем html разметка перекрывает её прозрачной картинкой, по этому когда пользователь пытается скачать картинку, он получает пустышку.

Эсли честно, оригинальный способ, такого ещё нигде не встречал...

Vovan-VE · 29.07.2012, 12:16

Сообщение от c4boomb

Эсли честно, оригинальный способ, такого ещё нигде не встречал...

Этот способ был изобретен и активно применялся Nное количество лет назад, когда никаких отладчиков в браузерах в помине не было, и когда почти у всех был IE5 или IE6. Вот в те времена этот способ, действительно, доставлял неудобств. Однако, и тогда никто не запрещал сохранить всю страницу со всем борохлом и достать из папки всё, что нужно.

В настоящее время такой способ вызывает сомнения. Проинспектировал элемент, нашел background-image - и нет проблемы.

Хотите по-настоящему защитить изображения от кражи - используйте водяные знаки.

Добавлено через 2 минуты
Помимо неэффективности, есть и еще одна сторона. По смыслу, фон - это оформление, а img - это контент. Поисковики, насколько я понимаю, должны интересоваться только контентом. Если на странице с описанием товара (дрель, например) фотку товара Вы выдаёте в виде фона, то поисковик и не считает, что фотка есть.

@Sergio Aguero · 29.07.2012, 13:58

Водяной знак это норм тема - можно даже пхп не знать, есть спец прога - Photo Watermark - тупо добавляет водяной знак вами созданный к тем фоткам, которые вы укажете при пакетной обработке)

Новые блоги и статьи Все статьи Все блоги /
Символьное дифференцирование igorrr37 13.02.2026 / * Логарифм записывается как: (x-2)log(x^2+2) - означает логарифм (x^2+2) по основанию (x-2). Унарный минус обозначается как ! */ #include <iostream> #include <stack> #include <cctype>. . .	Камера Toupcam IUA500KMA Eddy_Em 12.02.2026 Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .	И ясному Солнцу zbw 12.02.2026 И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.	«Знание-Сила» zbw 12.02.2026 «Знание-Сила» «Время-Деньги» «Деньги -Пуля»
SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 12.02.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 11.02.2026 Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL3_image 8Observer8 10.02.2026 Содержание блога Библиотека SDL3_image содержит инструменты для расширенной работы с изображениями. Пошагово создадим проект для загрузки изображения формата PNG с альфа-каналом (с прозрачным. . .	Установка Qt-версии Lazarus IDE в Debian Trixie Xfce volvo 10.02.2026 В общем, достали меня глюки IDE Лазаруса, собранной с использованием набора виджетов Gtk2 (конкретно: если набирать текст в редакторе и вызвать подсказку через Ctrl+Space, то после закрытия окошка. . .

@Sergio Aguero 452 / 443 / 21 Регистрация: 11.04.2012 Сообщений: 2,076
	29.07.2012, 13:58
	Водяной знак это норм тема - можно даже пхп не знать, есть спец прога - Photo Watermark - тупо добавляет водяной знак вами созданный к тем фоткам, которые вы укажете при пакетной обработке) 0