how to download a capture.png on the client side using roslibjs?

asked 2019-12-28 15:32:12 -0500

Abdel gravatar image

updated 2019-12-29 05:02:48 -0500

gvdhoorn gravatar image

Hello, I created a web page, which aims to display the stream sent by ros, through the topic "/raspicam_node/image". here is my html code;

img src="http://192.168.43.186:8080/stream?topic=/raspicam_node/image" alt="En attente des données camera" width="100%"/

what i'm trying to do is when i click on the save button that i already created, this download a capture.png on the client side( phone, laptop..), i tried to recover the "topic;/raspicam_node/image" in the js code, but when i click on the button it starts the download of the capture.png, which gives an error during the download.

here is part of the js code:

image_save.onclick = function() {

     var imageTopic = new ROSLIB.Topic({
            ros : ros,
        name : '/raspicam_node/image',
        messageType : 'sensor_msgs/Image'
    });

    var download = document.createElement('a');
    download.href = 'data:http://192.168.43.186:8080/stream?topic=/raspicam_node/image';
    download.download = 'capture.png';
    download.click();
}

if you have any advice i will be grateful

edit retag flag offensive close merge delete