javascript - 将 html2canvas 图片上传到数据库

Question

是否可以将 html2canvas 提供的图像上传到数据库。基本上，当我单击“保存”时，它会将我重定向到 save.php，我可以在其中查看我制作的屏幕截图、查看图像，并在我的本地服务器上本地查看图像。

主要问题是，能否制作一个表格，在 save.php 上，我可以将图像作为随机数(等 32245652226225.jpg)保存到特定文件夹中，并将值插入到数据库中，值如下:图像名称，图像日期

然后我可以从数据库中检索所有图像，并按日期对它们进行排序。如果有任何帮助，我将不胜感激。

这是我得到的结果

这是我的index.php

	function capture() {
		$('#target').html2canvas({
			onrendered: function (canvas) {
                //Set hidden field's value to image data (base-64 string)
				$('#img_val').val(canvas.toDataURL("image/png"));
                //Submit the form manually
				document.getElementById("myForm").submit();
			}
		});
	}

<form method="POST" enctype="multipart/form-data" action="save.php" id="myForm">
	<input type="hidden" name="img_val" id="img_val" value="" />
</form>
<input type="submit" value="Sacuvaj" onclick="capture();" />

<div id="target">
  <h1>TESTING</h1>
</div>

这是save.php

<?php
//Get the base-64 string from data
$filteredData=substr($_POST['img_val'], strpos($_POST['img_val'], ",")+1);

//Decode the string
$unencodedData=base64_decode($filteredData);

//Save the image
file_put_contents('slika.jpg', $unencodedData);
?>
<h2>Screenshoot</h2>
<table>
    <tr>
        <td>
            <a href="slika.jpg" target="blank">folder</a>
        </td>
        <td align="right">
            <a href="index.php">nazad</a>
        </td>
    </tr>
    <tr>
        <td colspan="2">
            <br />
            <br />
			<span>
			
			</span>
            <br />
<?php
//Show the image
echo $_POST['img_val'];
echo '<img class="img-responsive" src="'.$_POST['img_val'].'" />';
?>
        </td>
    </tr>
</table>
<style type="text/css">
body, a, span {
	font-family: Tahoma; font-size: 10pt; font-weight: bold;
}
img{
	width:400px;
}
</style>

Answer 1

答案是肯定的;)

我的意思是，您似乎已经自己找到了拼图:

• 在客户端捕获屏幕
• 通过表单将其提交给服务器
• 将捕获日期等元信息写入数据库，该数据库会返回您唯一的 ID 号(任何编号的 id)
• 将文件复制到文件名与文件 ID 相符的文件夹(并应用一些逻辑在文件 ID 的每 4 位数字上创建一个新的子文件夹)
• 有另一个脚本可以帮助您搜索和显示图像

如果您真的要求免费编码服务，很抱歉，我无法为您提供帮助。无论如何，对于数据库访问，那里有很好的教程，如果您只是缺乏这方面的一些基本知识。

---

顺便说一句。也许在服务器端将 html 渲染为 img 可能会更好: Convert HTML to image in php