convert Image to base64 without uploading

Question

i want to save image in localStorage in base 64 format.I know it using Filereader concept like this

function loadImageFileAsURL()
{
    var filesSelected = document.getElementById("inputFileToLoad").files;

    if (filesSelected.length > 0)
    {
        var fileToLoad = filesSelected[0];


        var fileReader = new FileReader();

        fileReader.onload = function(fileLoadedEvent) 
        {
        alert(fileLoadedEvent);

            document.getElementById("textAreaFileContents").innerHTML = fileLoadedEvent.target.result;
        };

        fileReader.readAsDataURL(fileToLoad);
    }
}

but the problem is that i dont want upload any file. I just want to convert existing image into base64.Hope someone can help it

Answer 1

Yeah it's kind off possible ;)

1. Create canvas element
2. Load your image onto it
3. Run canvas.toDataURL() (base64 encoded image)
4. Save it locally or anywhere you want