Question

我有一个小型Web应用程序，您可以在其上绘制画布并发表评论（使用表单提交）。现在，我只需要帮助将数据发送到MySQL数据库即可。

这是用户输入评论的表格。当他们单击“发布”按钮时，将运行一个名为“ boo”的函数。

<form action="testSave.php" method="post" onsubmit="boo();">
    <div id="canvas-bottom">
        <input type="text" id="comment-box" name="comment" placeholder="Comment"/>
        <input type="submit" id="post-button" name="post" value="Post"/>
    </div>
</form>

“ boo”函数获取画布数据并将其发送到另一个名为“ testSave.php”的PHP文件中。

<script>
function boo(){
    var canvasData = drawingCanvas.toDataURL();     
    $.ajax({
      type: "POST",
      url: "testSave.php",
      data: { 
         canvasData: canvasData
      }
    })
}
</script>

这是“ testSave.php”文件

<?php
if(isset($_POST['canvasData'], $_POST['post'])) {
    $img = $_POST['canvasData'];
    $filteredData = substr($img, strpos($img, ",")+1);

    $comment = strip_tags($_POST['comment']);   
    $comment = mysqli_real_escape_string($db, $comment);

    $sql = "INSERT into posts (sketch, comment) VALUES ('$filteredData', '$comment')";

    mysqli_query($db, $sql);

    header("Location: index.php");
}
?>

运行此命令后，它会将我发送到空白的白色网页（/testSave.php），此操作无效。

因此，我试图将这些数据发送到一行中“ sketch”（画布数据将到达的位置）和“ comment”（输入数据将到达的位置）下的mysql数据库表中。

如果有人可以帮助我，我将非常感激。

Answer 1

我没有看到您定义了$db可能是问题所在，因为您的代码不知道将数据插入到哪里。正如其他人所说，最好使用准备好的语句。

if(isset($_POST['canvasData']) and isset($_POST['post'])) {

$mysqlHost = "";
$mysqlUser = "";
$mysqlPassword = "";
$mysqlDatabase = "";

$db=mysqli_connect($mysqlHost, $mysqlUser, $mysqlPassword, $mysqlDatabase);
$img = $_POST['canvasData'];
$filteredData = substr($img, strpos($img, ",")+1);
$comment = strip_tags($_POST['comment']);

if (mysqli_connect_errno())
{
echo "Failed to connect to MySQL: " . mysqli_connect_error();
}

$stmt = $db->prepare("INSERT into posts (sketch, comment) VALUES (?, ?)");
$stmt->bind_param("ss", $filteredData, $comment);
$stmt->execute();
$stmt->close();
$db->close();
}
?>

Answer 2

由于您要使用ajax提交，因此代码应如下所示：

HTML

 <form action="" method="post">
        <div id="canvas-bottom">
            <input type="text" id="comment-box" name="comment" placeholder="Comment"/><br>
<span id="msg" style="color: green;font-style: italic;"></span> // success message
            <input type="submit" id="post-button" name="post" value="Post"/>
        </div>
    </form>

JS

$(document).ready(function(){
            $("#post-button").click(function(){
                var name =$("#comment-box").val();
                $.ajax({
                    url:'testSave.php',
                    method:'POST',
                    data:{
                        name:name
                    },
                   success:function(response){
                       $("#msg").html(response);
                   }
                });
            });
        });

PHP（testSave.php）

  <?php
        $img = $_POST['canvasData'];
        $filteredData = substr($img, strpos($img, ",")+1);

        $comment = strip_tags($_POST['comment']);   
        $comment = mysqli_real_escape_string($db, $comment);

        $sql = "INSERT into posts (sketch, comment) VALUES ('$filteredData', '$comment')";

        if (mysqli_query($db, $sql)) {
              echo "Inserted successfully";
       } else {
              echo "failed";
       }
    ?>

需要帮助将HTML和canvas数据插入MySQL数据库

2 个答案: