PHP Base64 Görsel Upload Edemiyorum

Merhaba,

Instagram API kullanarak fotoğraf paylaşacağım. Bunun için ilk olarak paylaşacağım görseli base64 formatında sunucuya upload etmeye çalışıyorum.
HTML'i ilk önce canvas'a daha sonra base64'e çevirip bir php dosyasına Ajax post kullanarak gönderiyorum. Fakat bir türlü başarılı bir şekilde upload ettiremiyorum...

$( document ).ready(function() {
    var container = document.getElementById("background");
    html2canvas(container, { allowTaint: true }).then(function (canvas) {
        $.ajax({
            url: "/vendor/test.php",
            type: "POST",
            data: {
                base64: canvas.toDataURL('image/png')
            },
            success: function(data)
            {
              console.log(data);
            }
        });
    });
});

gönderdiğim php dosyası:

$image = $_POST["base64"];
echo "$image";

$realImage = base64_decode($image);
$hedef="shareimg/";
$okk = file_put_contents($hedef."test2.png",$realImage);

if($okk == true){
  print("ok");
}else{
  print("no");
}

Yüklenen görsel aşağıdaki şekilde geliyor:



Manuel başka bir görseli base64 formatında gönderdiğimde başarılı bir şekilde istediğim görseli yüklüyor.

İncelemeniz için örnek base64 kodunu img src içerisine gömüp upload ettim: https://kisavoz.com/data.html

Sorun:
canvas.toDataURL('image/png') yazdığınız zaman data:image/png;base64,{base64_kodu} formatında çıktı veriyor. Img elementinin src tagına koyarsanız gözükür ama bu geçerli bir base64 kodu olmadığı için php ile parse edemezsiniz.

Çözüm:
canvas.toDataURL('image/png') kısmını canvas.toDataURL('image/png').replace('data:image/png;base64,', '') ile değiştirmek.

İşte bu, harikasınız teşekkür ederim Sorun çözüldü... Şimdi sırada Instagram'a göndermek var Instagram API ile hiç uğraşmamıştım umarım kolay bir yöntemi vardır