imagecreatefromstring issues with string passed from javascript

Question

I am having issues sending an image as a string between Javascript and PHP. So far I have:

data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAASAQMAAAByySynAAAABlBMVEUAAAD///+l2Z/dAAAAP0lEQVQImWNgPm9gwAAmbM4bH4AQzAdAYiDC/rzxByTi/+f/cIL

as the string which is being passed from the JS to PHP and this is verified as the image will load in chrome "as is".

I am using PHP to then

$im = imagecreatefromstring($data);

This however just errors, If I remove the data:image/png;base64 bit, it works but when it comes to the larger files, this just does not work.

I'm just wondering what I could have missed here.

Answer 1

You need to remove the header that is spat out from the canvas.toDataURL("image/png;base64");

you can either do it with javascript:

var imgData= canvas.toDataURL("image/png;base64");
var postData = {drawing:imgData.substr(22)};

or with php

substr($_POST['drawing'],22);