AJAX没有收到PHP响应

时间:2017-05-19 22:46:48

标签: php jquery ajax

我的ajax请求将文件放入目录 但是我收不到PHP文件的响应。

我使用提醒确定是否收到了回复。

非常感谢任何帮助。

function doodleSave() {
  var canvas = document.getElementById("doodle-canvas");
  var canvasData = canvas.toDataURL("image/png");
  $.ajax({
    url:'test.php',
    type:'POST',
    data:{ data:canvasData },
    success: function(response){
      alert(response);
      //echo what the server sent back...
    }
  });
}


<?php

/* AUTOMATED VARIABLES */
$upload_dir = "images/external/doodles/";
$url            = md5(uniqid(rand(), true));
$unique_post_id = md5(uniqid(rand(), true));
$timestamp      = time();
$nature         = "doodle";
$imageUrl       = $upload_dir.$url.'.png';

$img = $_POST['data'];
$img = substr($img,strpos($img,",")+1);
$data = base64_decode($img);
$file = $upload_dir . $url . ".png";
$success = file_put_contents($file, $data);


if(!$success) {

  exit('unable to upload'); // Prints success and exit the script

} else {

  exit($file); // Prints success and exit the script

}

?>

更新

我对ajax的成功和错误,它出现了错误。:

function doodleSave() {
  var canvas = document.getElementById("doodle-canvas");
  var canvasData = canvas.toDataURL("image/png");
  $.ajax({
    url:'test.php',
    type:'POST',
    data:{ data:canvasData },
      success: function(){
        alert('success');
      },
      error: function(){
        alert('failure');
      }
  });
}

2 个答案:

答案 0 :(得分:1)

使用json_encode通过AJAX发回数据。

<?php

/* AUTOMATED VARIABLES */
$upload_dir = "images/external/doodles/";
$url            = md5(uniqid(rand(), true));
$unique_post_id = md5(uniqid(rand(), true));
$timestamp      = time();
$nature         = "doodle";
$imageUrl       = $upload_dir.$url.'.png';

$img = $_POST['data'];
$img = substr($img,strpos($img,",")+1);
$data = base64_decode($img);
$file = $upload_dir . $url . ".png";
$success = file_put_contents($file, $data);
if(!$success) {

    echo json_encode(['filename' => false]);
    exit(); // Prints success and exit the script

} else {

   echo json_encode(['filename' => $file]);
   exit();
}

?>

在您的AJAX中执行此操作

function doodleSave() {
    var canvas = document.getElementById("doodle-canvas");
    var canvasData = canvas.toDataURL("image/png");
    $.ajax({
        url:'test.php',
        type:'POST',
        data:{ data:canvasData },
        success: function(response){
            var data = JSON.parse(response);
            if (data.filename != false) {
                alert(data.filename);
            }else {
                alert('unable to upload');
            }
        },
        error: function(){
            alert('failure');
        }
    });
}

您还可以使用$.post()这是$.ajax() POST请求的简写。

function doodleSave() {
    var canvas = document.getElementById("doodle-canvas");
    var canvasData = canvas.toDataURL("image/png");

    $.post('test.php', {data: canvasData}, function (response) {
        var data = JSON.parse(response);
        if (data.filename != false) {
            alert(data.filename);
        } else {
            alert('unable to upload');
        }
    })
}

答案 1 :(得分:0)

您需要用加号(+)替换所有空格。

您的代码有一个修复:

<?php

/* AUTOMATED VARIABLES */
$upload_dir = "images/external/doodles/";
$url            = md5(uniqid(rand(), true));
$unique_post_id = md5(uniqid(rand(), true));
$timestamp      = time();
$nature         = "doodle";
$imageUrl       = $upload_dir.$url.'.png';

$img = $_POST['data'];
$img = substr($img,strpos($img,",")+1);
$img = str_replace(' ', '+', $img); // Here is a fix
$data = base64_decode($img);
$file = $upload_dir . $url . ".png";
$success = file_put_contents($file, $data);


if(!$success) {

  exit('unable to upload'); // Prints success and exit the script

} else {

  exit($file); // Prints success and exit the script

}

?>