.ajax POST image data URL not working

Question

I have a canvas converted into a data url, and I need to save it locally in my server. For some reason I can't get this (simple) thing to work. It doesn't write any file on "natalisations" folder. The folder as the write permissions, and javascript seems to do it's work fine and with no errors. Php doesn't give me any error, just doesn't write the actual file.

Javascript

function postData(data) {
    alert(data);
    $.ajax({
        type: "POST",
        url: "uploadaux.php",
        data: {image: data}
    }).done(function( respond ) {
        alert(respond);
    });

the output of alert(data) is "data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDAAMCAgICAgMCAg(...)"

This is the uploadaux.php file:

if ( isset($_POST["image"]) && !empty($_POST["image"]) ) {    

    $dataURL = $_POST["image"];  

    $parts = explode(',', $dataURL);  
    $data = $parts[1];  

    $data = base64_decode($data);  

    $fp = fopen('natalisations/image.jpg', 'w');  
    fwrite($fp, $data);  
    fclose($fp); 
}

I've been debugging this for ages... and no sign of finding a solution. Thanks in advance!

Can you please put all your `data` value to check and try to replicate? — Oscar Jara, Dec 20 '13 at 22:55
Can you be a bit more descriptive, simply saying "It doesn't work" doesn't help at all. — ollieread, Dec 20 '13 at 22:55
"doesn't work" as in "doesn't right any file on "natalisations" folder. the folder as the right permissions, and javascript seems to do it's work fine and with no errors. php doesn't give me any error, just doesn't write the actual file — biip, Dec 20 '13 at 22:58
data is way too big to post, is there any way I could show you it's value? — biip, Dec 20 '13 at 22:59
http://stackoverflow.com/questions/5392344/sending-multipart-formdata-with-jquery-ajax Check your $_FILES[] — haldagan, Dec 20 '13 at 23:09
Sorry, I thought the problem was in posting data. Try outputting getcwd() to see if you use correct relative path to save your file. — haldagan, Dec 20 '13 at 23:21
it's fixed! the problem was file_put_contents needed the full path. no idea why — biip, Dec 20 '13 at 23:23

score 1 · Accepted Answer · answered Dec 20 '13 at 23:00

1

If you mean that your javascript isn't returning anything to you, it's because you have no return data in your PHP, try this, it also has a fair bit of debugging.

if(isset($_POST['image']) && !empty($_POST['image'])) {    

    $dataURL = $_POST['image'];  

    $parts = explode(',', $dataURL); 
    $data = base64_decode($parts[1]);

    if(is_writable('natalisations/')) {    
        $success = file_put_contents('natalisations/image.jpg', $data);
        echo ($success ? 'success' : 'unable to save file');
    } else {
        echo 'directory not writable';
    }
} else {
    echo 'no image';
}

answered Dec 20 '13 at 23:00

ollieread

6,018
1
20
36

it echoes "directory not writable". i just did chmod 777 to the path – biip Dec 20 '13 at 23:10
Likely because it needs the full path, ie `/home/username/public_html/natalisations/` – ollieread Dec 20 '13 at 23:13
it worked! thanks a lot! is this file_put_contents default behaviour? – biip Dec 20 '13 at 23:22
All write functions require 777 access – ollieread Dec 20 '13 at 23:32
i mean the full path thing. i believe the directory was writeable all the time – biip Dec 20 '13 at 23:33
That's how all the write functions work. – ollieread Dec 20 '13 at 23:40

.ajax POST image data URL not working

1 Answers1