尝试使用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);
?>