1

i got a problem on my website www.gucustom.cards I use html2canvas.hertzen.com to make a screenshot of an HTML part. Local everything works fine. On the live site, by clicking on the button to make the ajax call, it shows a 403 Error for the POST send PHP file.

I checked if PHP is working find on the Server and yes it is. Also max size and upload size is 512M. I tried to call the PHP page withpout the html2canvas part / without the base64URL and that was working as well. The problem seems to be this part "data: {image: base64URL}" When i send an empty data string there is no 403 error anymore.

$("#cardgeneratorForm").on("submit", function (event) {
    event.preventDefault();

    html2canvas(document.getElementById('card-build-inner')).then(function(canvas) {
        // Get base64URL
        var base64URL = canvas.toDataURL('image/png').replace('image/png', 'image/octet-stream');
        // AJAX request
        $.ajax({
            url: 'generatecard.php',
            method: 'POST',
            data: {image: base64URL},
            success : function(data){
                $('#outputcardlink').val(data);
            },
            fail: function(){
                $('#outputcardlink').val('Error! Please try again.');
            }
        });
    });
});
<?php
if ($_SERVER["REQUEST_METHOD"] == "POST")
{
    $image = $_POST['image'];
    $location = "card/";
    $image_parts = explode(";base64,", $image);
    $image_base64 = base64_decode($image_parts[1]);

    // Filename
    $timestamp = time();
    $random1 = rand(10, 99);
    $random2 = rand(10, 99);
    $filename = $random1.$timestamp.$random2.'.png';

    $file = $location.$filename;
    file_put_contents($file, $image_base64);

    http_response_code(200);
    echo "https://gucustom.cards/card/".$filename;
}
else
{
    // Not a POST request, set a 403 (forbidden) response code.
    http_response_code(403);
    echo "Error!";
}
?>

I need help to send the base64URL to the PHP page without the 403 error, maybe i miss some ajax infos to send.

Dapp Future
  • 165
  • 1
  • 12
  • Did you try URL [encoding](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/encodeURIComponent) the base64 string? Something like `{image: encodeURIComponent(bas64URL)}`. Then you'd have to make sure and decode in php with [urldecode](https://www.php.net/manual/en/function.urldecode.php). – Richard Cagle Oct 21 '19 at 02:46
  • @RichardCagle jQuery takes care of the correct encoding – Phil Oct 21 '19 at 04:17
  • @Phil this is not allowed by my host (namesheap) – Dapp Future Oct 21 '19 at 04:42
  • Then ask them nicely to fix it for you or find a new host – Phil Oct 21 '19 at 04:44
  • 2
    @Phil I contacted the support as u said, and yes they had the deactivate 2 mod security rules for my server. Now it works. – Dapp Future Oct 21 '19 at 05:51

0 Answers0