Save and error when displaying dataURI

I'm using the signature_pad library sign contracts on my website. I have a button on my insertContract page that opens an other windows with a canvas where you can sign and save the canvas with canvas.toDataURL().
I use this method to transfer the data to my insertContract window :

   

Code:

saveButton.addEventListener("click", function (event) {
    if (signaturePad.isEmpty()) {
        alert("Please provide signature first.");
    } else {
        if(self.opener)
        {
            //window.open(signaturePad.toDataURL());
            opener.document.getElementsByName('signature').item(0).value = signaturePad.toDataURL();
        }
        window.close();
    }
    });

I store it in this input value with the javascript above, in my insertContract form :


   

Code:

<input type="text" readonly id="signature" name="signature" value="" class="signature">

And then, my Controller adds it to the database without modification.
When I look in PHPMyAdmin, it is stored, correctly it seems :



But when I want to display it with :

   

Code:

<img src="data:image/png;base64,<?php echo $contrat->signature; ?>">

It doesn't work, and the console says : 



I have a [removed] at the beginning, and even if I delete the data:image/png;base64, before, it doesn't work.

If I do a console.log(signaturePad.toDataURL());, the link appears in the console without the [removed], I can pass the data to my other window. It seems that the error is when the link is passed to the controller because when I var_dump($this->input->post('signature'));
I get the link with the [removed] like the image above.



Do you have any idea to help me ? Thanks.

Could this be because the comma is not permitted in urls from the configuration file?

Look for this line inside application/config/config.php and add the comma in there:

$config['permitted_uri_chars'] = 'a-z 0-9~%.:_\-';

Website: http://avenir.ro