Home » Мои разработки » Размещение изображения с web-камеры на сайте

Размещение изображения с web-камеры на сайте

Данный метод достаточно распространен, я его использовал для сайтов MR-Group и ИНТАЧ СТРАХОВАНИЕ.

Метод основан на использовании фрейма с установленным временем refresh'a.

Сейчас конечно развивается отображение с web-камеры в формате реального времени, с использованием видео-потоков и медиа-серверов. В моих проектах на тот момент ничего подобного не было, был только хостинг, простая web-камера и задача сделать размещение изображения с камеры на сайте.

Смысл следующий:

  1. На камере настраивается пересылка изображения на FTP хостинга, во многих современных камерах данный функционал присутствует;
  2. Размещается код на сайте, который периодически обновляет картинку во фрейме.

Реализация пункта 2.

<iframe src="http://<путь к html-файлу, в нем указывается путь к картинке, а также время refresh'a>/webcam.html" vspace="0" hspace="0" marginwidth="0" marginheight="0" scrolling="no" width="352" frameborder="0" height="288"></iframe>

Html-файл (пример):

  1. <html>
  2. <head>
  3. <META http-equiv="Content-Type" content="text/html; charset=windows-1251">
  4. <title>Веб-камера</title>
  5. <link rel="stylesheet" type="text/css" href="/css/default.css">
  6. <meta http-equiv="Refresh" content="10"><!-- 10 - означает, что будет refresh, раз в 10 секунд -->
  7. <style>body{margin: 0px;background-color: #FFF;}</style>
  8. </head>
  9. <body>
  10. <img src="http://<путь к картинке с web-камеры>/web-cam.jpg" width="352" height="288" border="0">
  11. </body>
  12. </html>

Вот и всё.