How to save an image from canvas

Question

Recently I\'ve been attempting to create a photo booth by relying on Webrtc and have nearly completed all of the code except I\'ve not been able to figure out a way to save

Answer 1

I had this problem and this is the best solution without any external or additional script libraries: In Javascript tags or file create this function: We assume here that canvas is your canvas:

function download(){
        var download = document.getElementById("download");
        var image = document.getElementById("canvas").toDataURL("image/png")
                    .replace("image/png", "image/octet-stream");
        download.setAttribute("href", image);

    }

In the body part of your HTML specify the button:

Download

This is working and download link looks like a button.