从javascript中的ajax调用PHP

时间:2019-03-21 12:53:13

标签: javascript php ajax

尝试使用html2canvas保存页面捕获 验证完成,但保存未完成 我收到“方法不允许错误” 如果我注释除php调用以外的所有内容,则会出现“未找到”错误 我是这一切的新手,可能是我缺少了一些东西

在同一文件夹cfsanad中找到文件test.cfm和export.php

test.cfm

<!doctype html>
<html>
<head>
<script type="text/javascript" src="SCRIPTS/es6-promise.min.js"></script>
<script type="text/javascript" src="SCRIPTS/es6-promise.auto.min.js"> </script>
<script type="text/javascript" src="SCRIPTS/html2canvas.js"></script>
<script type="text/javascript" src="SCRIPTS/jquery-2.1.0.min.js"></script>
</head>
<body>
<h1>Take screenshot of webpage with html2canvas</h1>
<div class="container" id='container' >
 hi
 bye
</div>
<input type='button' id='but_screenshot' value='save screenshot' onclick='exportAndSaveCanvas();'><br/>
<br/>
<!-- Script -->
<script type='text/javascript'>
function exportAndSaveCanvas()  {
try
{
   html2canvas(document.body).then(function(canvas) {

     document.body.appendChild(canvas);

     // Get base64URL
     var base64URL = canvas.toDataURL('image/jpeg').replace('image/jpeg', 'image/octet-stream');

     // AJAX request
     $.ajax({
       type: 'POST',
        url: 'export.php',
        data: {image: base64URL},
        success: function(data){
           alert('Upload successfully');
           },
        error: function(XMLHttpRequest, textStatus, errorThrown) { 
                alert("Status: " + textStatus+ "\nError: " + errorThrown);
        }
     }); //ajax

   }); //html2canvas
 }
 catch(err)
{
    alert('DBconnect: '+err.message);
    return 'err';
}
} // End exportAndSaveCanvas()
</script>

</body>
</html>

export.php

<?php
$message = "in php";
echo "<script type='text/javascript'>alert('$message');</script>";

$image = $_POST['image'];

$location = "IMAGES/";

$image_parts = explode(";base64,", $image);

$image_base64 = base64_decode($image_parts[1]);

$filename = "screenshot_".uniqid().'.png';

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

0 个答案:

没有答案