Question

我正在尝试使用它来将图像存储到psql中。 DB有一个表，其中包含两个字段，ID和IMG bytea类型。该页面包含2个标签。它具有“ openCity”功能，可在点击时加载标签。

选项卡/表格工作正常。我开始实现图像存储功能，为此添加一些代码。但是现在，当我单击任何选项卡以测试图像存储代码是否正常工作时，它会引发异常“未定义openCity”。

如何删除此错误/异常。

这是我的代码：

        <!DOCTYPE html>
        <html lang="en">
        <head>
          <title>Bootstrap Example</title>
          <meta charset="utf-8">
          <meta name="viewport" content="width=device-width, initial-scale=1">
          <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">
          <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
          <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"></script>
          <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>

        <body>
        <?php
        require("connection.php");
        ?>
        <div class="container-fluid">
        <h1 align="center">DB Form </h1>
          <div class="tab">
          <button class="tablinks" onclick="openCity(event, 'Insert Record')">Insert Record</button>
          <button class="tablinks" onclick="openCity(event, 'Search Database')">Search Database</button>

        </div>
    <div id="Insert Record" class="tabcontent">

       <form action="" method="post" class="needs-validation" novalidate enctype="multipart/form-data"> 
        <h2> Field </h2>
      <div class="form-row">
        <div class="col-md-4 mb-3">
          <label for="validationCustom01">Field ID</label>
          <input type="number" class="form-control" name="field_id" id="field_id" placeholder="insert field id" value="" required>
          <div class="valid-feedback">
            0
          </div>
        </div>
          <div class="col-md-4 mb-3">
          <label for="validationCustom02">IMG</label>
          <input type="file" class="form-control" name="img" id="img" placeholder="insert" value="" required>
          <div class="valid-feedback">
            Looks good!
          </div>
        </div>
        </div>      

      <button class="btn btn-primary" name="submit1" type="submit">Insert Records</button>
    </form>


        <?php

              if(isset($_POST["submit1"])){


                  $file_name = $_POST["img"];

                  $img = fopen($file_name, 'r') or die("cannot read image\n");
                  $data = fread($img, filesize($file_name));

                  $es_data = pg_escape_bytea($data);
                  fclose($img);

                try {

                    $sql = "INSERT INTO fields (field_id, img)
                    VALUES ('".$_POST["field_id"]."','".$es_data."')";
                    if ($conn->query($sql)) {
                         echo "<script type= 'text/javascript'>alert('New Record Inserted Successfully');</script>";
                              }
                              else{
                                echo "<script type= 'text/javascript'>alert('Data not successfully Inserted.');</script>";
                          }
                                $dbh = null;
                        }
                            catch(PDOException $e)
                        {
                            echo $e->getMessage();
                            }
                        }   

                        //$conn = null;

                        ?>

</div>

<div id="Search Database" class="tabcontent">     
</div>

<script>
function openCity(evt, cityName) {
    var i, tabcontent, tablinks;
    tabcontent = document.getElementsByClassName("tabcontent");
    for (i = 0; i < tabcontent.length; i++) {
        tabcontent[i].style.display = "none";
    }
    tablinks = document.getElementsByClassName("tablinks");
    for (i = 0; i < tablinks.length; i++) {
        tablinks[i].className = tablinks[i].className.replace(" active", "");
    }
    document.getElementById(cityName).style.display = "block";
    evt.currentTarget.className += " active";
}
</script>

</div>

</body>
</html>

Answer 1

JavaScript在浏览器中运行，浏览器无法看到您的PHP代码。您可以使用查看源代码功能查看在浏览器中运行的实际代码，该功能通常映射到 Ctrl + U 。发生错误时，您可以看到openCity()定义没有任何痕迹。

提交表单时，您的代码完全中断，因为如果找不到图片，您abort会突然{}：

die("cannot read image\n")

...而且由于您是从表单字段读取图像，因此不可能找到图像：

$file_name = $_POST["img"];

...不存在，因为表单控件的类型为file：

<input type="file" class="form-control" name="img" id="img" placeholder="insert" value="" required>

...和file uploads don't work that way。

还有一些其他问题，主要是公然的安全整体：

SQL注入

$sql = "INSERT INTO fields (field_id, img) VALUES ('".$_POST["field_id"]."','".$es_data."')";
                                                      ^^^^^^^^^^^^^^^^^^

可能自由访问任意文件（由于上传处理不当）：
```
$file_name = $_POST["img"];
$img = fopen($file_name, 'r')
```

Misuse of exception handling：

catch(PDOException $e) {
    echo $e->getMessage();
}

但是我认为主要问题是缺乏流程设计。代码的组织方式无法正确处理错误。

未捕获的参考错误：未定义openCity（）

1 个答案: