Clerification需要重新:在mySQL数据库中将base64 INSERT到BLOB

时间:2018-01-23 16:05:37

标签: php mysql forms canvas

我正在使用canvas元素在协议表单上收集签名。在提交表单之前,canvas元素将转换为base64字符串,然后存储在HIDDEN表单字段中。

当base64字符串访问正在处理并将表单元素插入到我的数据库中的PHP页面时,它看起来如下所示:

data:image/jpeg;base64,/9j/4AAQSkZJ......RgABAQAAS

我尝试了许多不同的ENCODE和DECODE组合...... ESCAPE_STRING ...获取文件内容...将这个base64字符串保存到我的数据库中,但数据永远不会进入数据库。

我的PHP将此表单插入到我的数据库中,目前看起来像是:

<?php 
include ('header.php');
include ('connect.php');
// prepare and bind
$stmt = $conn->prepare("INSERT INTO deposit (type, amount, created, agreement, signature, project_id) VALUES (?,?,?,?,?,?)");
$stmt->bind_param("ssssbs", $type, $amount, $created, $agreement, $signature, $project_id);
// set parameters
$created = date("Y-m-d H:i:s");
$amount = htmlspecialchars($_POST['amount']);
$type = htmlspecialchars($_POST['type']);
$agreement = $_POST['agreement'];


$hidden_data = $_POST['hidden_data'];
$escaped = mysqli_real_escape_string ($hidden_data);
$signature = base64_decode($escaped);


$project_id = $_POST['project_id'];
// execute 
$stmt->execute();
$deposit_id = ($stmt->insert_id);
echo "$amount - created successfully";
$stmt->close();
?>
<form action="project.php" method="post">
    <div class="wrapper">   
        <input name="project_id" value="<?php echo $project_id; ?>" type="hidden">
        <input type="submit" value="Go back to project">
    </div>  
</form>
<?php 
include ('disconnect.php');
include ('footer.php');
?>

如果我正确理解了这个过程,我需要:

1)从字符串的开头剥离“data:image / jpeg; base64”

2)转换或解码或编码剩余数据

3)使用INSERT

将数据保存到BLOB

我发现的关于这个过程的信息的大部分内容与我的代码设置方式有很大的不同,我不知道如何重新组织它以适应我在这里所拥有的内容。有人可以告诉我这个过程在我在这里使用的CODE结构类型中是如何工作的吗?

我在这个应用程序中有另一个地方从相机收集图像,将其存储在一个文件中,并使用$ _FILE而不是$ _POST进行处理。这个过程有效,图像存储在数据库BLOB中,我可以稍后获取信息进行显示。该代码如下:

$data = $conn->real_escape_string(file_get_contents($_FILES  ['uploaded_file']['tmp_name']));

我尝试将$ _FILES更改为$ _POST,但这只是打破了所有内容。

提前感谢您的时间。

编辑1:

以下是收集此处使用的数据的表单:

<?php 
include ('header.php');
include ('legal_deposit_agreement_display.php');
?>
<form action="legal_deposit_agreement_create.php" method="post" enctype="multipart/form-data" id="form" name="form">

    <input name="hidden_data" id='hidden_data' type="hidden"/>
    <input name="project_id" value="<?php echo $project_id; ?>" type="hidden">

    <h1>Deposit</h1>

    <div class="wrapper">
        <label>Ammount of Deposit</label><br>
        <input name="amount" value="<?php echo $amount; ?>" placeholder="Enter Ammount of deposit here" type="text" tabindex="1" required>
    </div>

    <div class="wrapper">   
        <label>Payment Type</label><br>
        <select name="type" tabindex="3">
            <option value="Cash/Credit"<?php if ($type == 'Cash/Credit') echo ' selected="selected"'; ?>>Cash/Credit</option>
            <option value="Gift Certificate"<?php if ($type == 'Gift Certificate') echo ' selected="selected"'; ?>>Gift Certificate</option>
        </select>
    </div>

    <div class="wrapper">
        <label>Deposit Agreement</label><br>
        <textarea id="agreement" name="agreement" style="overflow:hidden" TextMode="MultiLine" onkeyup="setHeight('textBox1');" onkeydown="setHeight('textBox1');" tabindex="4" value="<?php include 'text/depositAgreement.txt';?>"><?php include 'text/depositAgreement.txt';?></textarea>
        <script type="text/javascript">
            function setHeight(fieldId){
                document.getElementById(fieldId).style.height = document.getElementById(fieldId).scrollHeight+'px';
            }
            setHeight('agreement');
        </script>
    </div>

    <div id="signature-pad" class="signature-pad">
        <div class="signature-pad--body">
          <canvas id="canvas" name="canvas"></canvas>
        </div>
        <div class="signature-pad--footer">
          <div class="description">Sign above</div>

          <div class="signature-pad--actions">
            <div>
              <button type="button" class="button clear" data-action="clear">Clear</button>
            </div>
          </div>

        </div>
    </div>

    <script src="js/signature_pad.js"></script>
    <script src="js/app.js"></script>

    <div class="wrapper">
    <input type="button" onclick="convert()" value="I AGREE TO ALL OF THE TERMS DESCRIBED ABOVE">
    </div>

</form>

<script>
    function convert() {
        document.getElementById('hidden_data').value = canvas.toDataURL('image/jpeg', 0.5);
        document.forms["form"].submit();
    };
</script>

<?php include ('footer.php');?>

1 个答案:

答案 0 :(得分:2)

文件/ $_FILES需要<form>中的有效enctype,即enctype="multipart/form-data",并且不是您发布内容的一部分。

在那里应该有一个file的输入类型并使用它的命名属性,然后传递分配给$_FILES超全局的变量。然后,您可以像b中那样使用bind_param()

此行不包含帖子中的文件输入:

$data = $conn->real_escape_string(file_get_contents($_FILES  ['uploaded_file']['tmp_name']));

如果您想将BLOB上传到您的数据库,请使用我在此处发布的内容并阅读处理文件的手册。

此行失败,因为您没有为其传递连接参数:

$escaped = mysqli_real_escape_string ($hidden_data);

应为:

$escaped = mysqli_real_escape_string ($conn, $hidden_data);