Можно ли поместить двоичные данные изображения в HTML-разметку, а затем получить изображение, как обычно, в любом браузере? - PullRequest
47 голосов
/ 12 марта 2010

Это важный вопрос безопасности, и я уверен, что это возможно.

Простой пример:

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

Здесь возникает проблема: возможно, кто-то сканирует каталоги изображений вашего сервера. Но вы хотите защитить своих пользователей от таких атак.

Если возможно поместить двоичные данные изображения непосредственно в разметку HTML, вы можете ограничить пользовательский доступ к вашим каталогам изображений для пользователя, сгруппировать запуски вашего веб-приложения и передать данные изображения вашему пользователю Apache Группировать прямо в HTML.

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

Уже есть возможность?

Ответы [ 5 ]

81 голосов
/ 12 марта 2010

Существуют и другие (лучшие) способы, описанные в других ответах, для защиты ваших файлов, но да, возможно встроить изображение в ваш HTML.

Используйте тег <img> следующим образом:

<img src="data:image/gif;base64,xxxxxxxxxxxxx...">

Где часть xxxxx... представляет собой кодировку base64 данных изображения gif.

12 голосов
/ 12 марта 2010

Если бы мне нужна была безопасность в моем каталоге изображений, я бы вообще не открывал этот каталог. Вместо этого мои атрибуты img src будут ссылаться на страницу, в которой в качестве параметра будут использоваться идентификатор пользователя и идентификатор изображения.

Страница подтвердила бы, что этот пользователь действительно имел доступ к этой картинке. Если все хорошо, отправьте двоичный файл обратно. В противном случае ничего не отправляйте.

например:

<img src="imgaccess.php?userid=1111&imgid=223423" />

Кроме того, я бы не использовал предположительные идентификаторы. Вместо этого придерживаясь чего-то вроде base 64 закодированного guid.

3 голосов
/ 12 марта 2010

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

<img src="/images/getImage.aspx?id=123353 />
1 голос
/ 12 марта 2010

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

<img src="/app/getImage.xyz?image=12345&token=12a342e32b321" />

Очень маловероятно, что кто-то будет грубо насиловать нужный жетон в нужное время с нужным изображением. Есть хотя бы возможности проверить токен в "getImage":

  1. Отслеживайте все теги изображений в вашем приложении и сохраняйте записи в базе данных, которые связывают случайно сгенерированные токены и идентификаторы изображений с запрашивающими пользователями. Затем действие «getImage» проверяет предоставленные параметры в этой базе данных.
  2. Сгенерируйте токен в виде контрольной суммы (MD5, CRC и т. Д.) На основе идентификатора пользователя, идентификатора изображения и, возможно, текущего дня года, и обязательно смешайте его с неосуществимой солью. Затем действие «getImage» пересчитает контрольную сумму и сверит ее с указанной, чтобы проверить доступ пользователя. Этот метод даст меньше накладных расходов, чем первый.

Пример PHP:

$token = md5($_SESSION['user_id'].' '.$imageID.' '.$SECRET_SALT.' '.date('z'));
0 голосов
/ 12 марта 2010

С HTML5 вы можете использовать тег canvas и JavaScript для этого.

Возможно, вы могли бы что-то сделать с помощью CSS или макета таблицы, чтобы нарисовать картинку (вероятно, очень плохая производительность, разрешение, переносимость).

В любом случае, никто не мешает людям снимать ваши фотографии. Они могли бы сделать скриншот и вырезать его.

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

...