Home > Software design >  calling js function in PHP Post Request
calling js function in PHP Post Request

Time:08-26

I'm trying to call a javascript function after making a POST request using Jquery $.post() post request sends base64 image data and writes it down in the server the problem is that the post request is done and the file is uploaded but there is no javascript function called getCounterNumber(); is not working, the function supposed to do this

function getCounterNumber(Path){
  Tesseract.recognize(
  Path,
  'eng',
  { logger: m => console.log(m) }
).then(({ data: { text } }) => {
   window.location.href = "getcounterreading.php?counterNumber=" text "";
})
}

jQuery crop button click

            var base64data = reader.result;
            $.post('http://127.0.0.1/counter/uploadcounter.php', {image:base64data}, 
            function(response){ 
                  bs_modal.modal('hide');
                  alert("success upload image");
                      window.location.href = "uploadcounter.php";
                      console.log(response);

              });

uploadcounter.php

if ($_SERVER['REQUEST_METHOD'] == 'POST'){
$folderPath = '../../uploads/counters/';

$image_parts = explode(";base64,", $_POST['image']);
$image_type_aux = explode("image/", $image_parts[0]);
$image_type = $image_type_aux[1];
$image_base64 = base64_decode($image_parts[1]);
$file = $folderPath . uniqid() . '.png';
file_put_contents($file, $image_base64);
echo ("image uploaded successfully.");
console.log($file);
echo '<script>getCounterNumber("'.$file.'")</script>'; 
}

CodePudding user response:

Don't return a tag. Return a JSON instead.

Your Javascript

(I'm using $.ajax() instead of $.post() for no particular reason. Maybe because it's more descriptive):

let base64data = reader.result;
let postData = { image:base64data };

$.ajax({
    type: "POST",
    url: 'http://127.0.0.1/counter/uploadcounter.php',
    data: postData,
    success: (result) => {
        bs_modal.modal('hide');
        getCounterNumber(result.data.file);
        alert("success upload image");
        console.log(response);
    },
    error: (error) => {
        alert("There was an error. Check JS Console.");
        console.log(error);
    },
    dataType: 'json'
});

Your PHP

if ('POST' === $_SERVER['REQUEST_METHOD']) {
    $folderPath = '../../uploads/counters/';
    
    $image_parts = explode(";base64,", $_POST['image']);
    $image_type_aux = explode("image/", $image_parts[0]);
    $image_type = $image_type_aux[1];
    $image_base64 = base64_decode($image_parts[1]);
    $file = $folderPath . uniqid() . '.png';
    file_put_contents($file, $image_base64);
    
    header("Content-Type: application/json");
    echo json_encode(["file" => $file]);
    exit();
}

Please note that I haven't run nor tested the code. It's just an example that you can follow as an inspiration.

  • Related