Robotics StackExchange | Archived questions

add ros image with web_video_server in html

How do i properly add the streamed video done by webvideoserver to html? here i tried this code but its not showing any live streaming as can be seen in video?

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
  </head>
  <body>
    <video width="320" height="240" controls>
      <source src=”http://192.168.1.71:8080/stream_viewer?topic=/cv_camera/image_raw&type=ros_compressed” >
    </video>
        <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. 

It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.</p>
  </body>
</html>

Here when i use the url i.e http://192.168.1.71:8080/stream_viewer?topic=/cv_camera/image_raw&type=ros_compressed the video is being streaming on web. but the same url is not working when i add it to html code.

Asked by dinesh on 2020-04-15 02:15:16 UTC

Comments

Could it be that you using the node "web_video_server" with type="mjpeg"? If so you get images, not a video:

      <body><img src=”http://192.168.1.71:8080/stream_viewer?topic=/cv_camera/image_raw&type=ros_compressed” ></img></body>

Asked by Humpelstilzchen on 2020-04-15 03:48:31 UTC

i tired that but it is not working.

Asked by dinesh on 2020-04-15 05:47:06 UTC

Anything in the Browser console?

Asked by Humpelstilzchen on 2020-04-15 05:58:21 UTC

ok after i used the iframe tag in html file it is working.

Asked by dinesh on 2020-04-15 06:13:25 UTC

Answers