加载时将图像绑定到文件上传字段

Posted 2023-05-08

【中文标题】加载时将图像绑定到文件上传字段

【英文标题】：Bind image to fileupload field on load

【发布时间】：2019-05-24 13:43:08

【问题描述】：

我正在开发一个可以上传学生数据（包括个人资料照片）的杂项。

我的问题是在更新时，因为并非所有字段都是必需的。我收到错误消息说Undefined index: file 这是$_FILES["file"]["name"] 这一行。

所以我想要实现的是将图像加载到文件上传字段。

我只能显示文件名，但我的问题是将图像从源绑定到字段。

PHP

<?php
$target_dir = "uploads/";
$target_file = $target_dir . basename($_FILES["file"]["name"]);
$uploadOk = 1;
$imageFileType = strtolower(pathinfo($target_file,PATHINFO_EXTENSION));
// Check if image file is a actual image or fake image
if(isset($_POST["submit"])) 
    $check = getimagesize($_FILES["fileToUpload"]["tmp_name"]);
    if($check !== false) 
        echo "File is an image - " . $check["mime"] . ".";
        $uploadOk = 1;
     else 
        echo "File is not an image.";
        $uploadOk = 0;
    

?>

HTML

<div class="form-group">
    <label>Upload Image:&nbsp;</label>
    <div class="input-group image-preview">
        <input type="text" class="form-control image-preview-filename" disabled="disabled"> <!-- don't give a name === doesn't send on POST/GET -->
        <span class="input-group-btn">
            <!-- image-preview-clear button -->
            <button type="button" class="btn btn-default image-preview-clear" style="display:none;">
                <span class="glyphicon glyphicon-remove"></span> Clear
            </button>
            <!-- image-preview-input -->
            <div class="btn btn-default image-preview-input">
                <span class="glyphicon glyphicon-folder-open"></span>
                <span class="image-preview-input-title">Browse</span>
                <input type="file" accept="image/png, image/jpeg, image/gif" name="input-file-preview" id="uploadimage" /> <!-- rename it -->
            </div>
        </span>
    </div>
</div>

【问题讨论】：

这可不行。为什么要再次上传之前上传的同一张图片？只需检查是否上传了另一个文件，然后更新图像表或表中的图像列。如果没有上传新图片，请保留旧图片。

问题说你正在检查$_FILES['input-file-preview']，但你的问题说你的行是$_FILES["file"]["name"]。它是一个或另一个。请解决您的问题。

@yivi 抱歉，这是一个拼写错误

没问题。但是编辑您的问题，使其有意义。 :)

现在您在某些地方使用file，在其他地方使用fileToUpload。它与 html 代码不匹配，这是我回答的基础。发布的代码应该与真实的工作内容一样接近。

【参考方案1】：

您需要仔细阅读this。

基本上你在检查$_FILES["fileToUpload"]["name"]，但在你的HTML代码中你指的是name="input-file-preview"

所以你的$_FILES 索引应该是input-file-preview。

例如$_FILES['input-file-preview'];

此外，在使用之前验证数组索引是否存在总是一个好主意。

例如

if(isset($_POST["submit"]) && array_key_exists($_FILES['fileToUpload']) ) 
   $target_dir = "uploads/";
   $target_file = $target_dir . basename($_FILES["fileToUpload"]["name"]);
   $uploadOk = 1;
   $imageFileType = strtolower(pathinfo($target_file,PATHINFO_EXTENSION));

   // Check if image file is a actual image or fake image

    $check = getimagesize($_FILES["fileToUpload"]["tmp_name"]);
    if($check !== false) 
        echo "File is an image - " . $check["mime"] . ".";
        $uploadOk = 1;
     else 
        echo "File is not an image.";
        $uploadOk = 0;