ฉันจะเลือกและอัปโหลดไฟล์หลายไฟล์ด้วย HTML และ PHP โดยใช้ HTTP POST ได้อย่างไร


155

<input type="file">ผมมีประสบการณ์ทำเช่นนี้กับการอัปโหลดไฟล์เดียวโดยใช้ อย่างไรก็ตามฉันมีปัญหาในการอัปโหลดมากกว่าหนึ่งครั้ง

ตัวอย่างเช่นฉันต้องการที่จะสามารถเลือกชุดของภาพแล้วอัปโหลดไปยังเซิร์ฟเวอร์ทั้งหมดในครั้งเดียว

มันจะเป็นการดีถ้าใช้ตัวควบคุมอินพุตไฟล์เดียวถ้าเป็นไปได้

ไม่มีใครรู้วิธีการทำเช่นนี้? ขอบคุณ!


2
คุณหมายถึงเลือกมากกว่าหนึ่งไฟล์ในกล่องโต้ตอบตัวเลือกไฟล์หรือใช้หลายอินพุตไฟล์?
MitMaro

สวัสดีคุณสามารถอัปโหลดไฟล์เก็บถาวร (zip, rar, tar, ... ) หรือไม่
sourcerebels

คำตอบ:


196

นี้เป็นไปได้ในHTML5 ตัวอย่าง (PHP 5.4):

<!doctype html>
<html>
    <head>
        <title>Test</title>
    </head>
    <body>
        <form method="post" enctype="multipart/form-data">
            <input type="file" name="my_file[]" multiple>
            <input type="submit" value="Upload">
        </form>
        <?php
            if (isset($_FILES['my_file'])) {
                $myFile = $_FILES['my_file'];
                $fileCount = count($myFile["name"]);

                for ($i = 0; $i < $fileCount; $i++) {
                    ?>
                        <p>File #<?= $i+1 ?>:</p>
                        <p>
                            Name: <?= $myFile["name"][$i] ?><br>
                            Temporary file: <?= $myFile["tmp_name"][$i] ?><br>
                            Type: <?= $myFile["type"][$i] ?><br>
                            Size: <?= $myFile["size"][$i] ?><br>
                            Error: <?= $myFile["error"][$i] ?><br>
                        </p>
                    <?php
                }
            }
        ?>
    </body>
</html>

นี่คือลักษณะที่ปรากฏใน Chrome หลังจากเลือก 2 รายการในกล่องโต้ตอบไฟล์:

เลือกหลายไฟล์ของ chrome

และนี่คือลักษณะหลังจากคลิกปุ่ม "อัปโหลด"

ส่งหลายไฟล์ไปยัง PHP

นี่เป็นเพียงภาพร่างของคำตอบที่ทำงานได้อย่างสมบูรณ์ ดูคู่มือ PHP: การจัดการการอัปโหลดไฟล์สำหรับข้อมูลเพิ่มเติมเกี่ยวกับการจัดการการอัปโหลดไฟล์ที่เหมาะสมใน PHP


8
มันผ่านการตรวจสอบ w3c หรือควรจะเป็นmultiple="multiple"?
vol7ron

10
ผมเชื่อว่ามันถูกต้อง: thoughtresults.com/html5-boolean-attributes มันผ่านตัวตรวจสอบความถูกต้อง w3c หากคุณเพิ่ม <! doctype html>
Mark E. Haase

2
ใช่มันอาจตรวจสอบ HTML แต่ล้มเหลว XHTML แม้ว่าฉันจะยังคงต้องการใช้ XHTML อยู่ แต่ฉันคิดว่าผู้คนควรที่จะหลีกเลี่ยงมันในทุกวันนี้
vol7ron

11
ไม่สามารถใช้งานได้หากไม่มีการเพิ่มชื่อคุณสมบัติ(เช่นname="file[]") ฉันพยายามแก้ไขคำตอบแต่ถูกปฏิเสธ
Michel Ayres

1
ขอบคุณ @MichelAyres ฉันได้อัปเดตคำตอบของฉันแล้ว เมื่อฉันเขียนสิ่งนี้ฉันก็แค่ระบุส่วน HTML ของปัญหา b / c มีคำตอบอื่น ๆ ที่อธิบายส่วนของ PHP เมื่อเวลาผ่านไปนี่เป็นคำตอบที่ได้รับความนิยมดังนั้นตอนนี้ฉันจึงขยายเพื่อครอบคลุมทั้ง HTML และ PHP
Mark E. Haase

94

มีบางสิ่งที่คุณต้องทำเพื่อสร้างการอัปโหลดไฟล์หลายไฟล์ซึ่งเป็นพื้นฐานที่ค่อนข้างดี คุณไม่จำเป็นต้องใช้ Java, Ajax, Flash เพียงสร้างแบบฟอร์มอัปโหลดไฟล์ปกติที่เริ่มต้นด้วย:

<form enctype="multipart/form-data" action="post_upload.php" method="POST">

จากนั้นกุญแจสู่ความสำเร็จ;

<input type="file" name="file[]" multiple />

อย่าลืมวงเล็บเหล่านั้น! ใน post_upload.php ลองทำสิ่งต่อไปนี้:

<?php print_r($_FILES['file']['tmp_name']); ?>

โปรดสังเกตว่าคุณได้รับอาร์เรย์ที่มีข้อมูล tmp_name ซึ่งหมายความว่าคุณสามารถเข้าถึงแต่ละไฟล์ด้วยวงเล็บสามคู่พร้อมตัวอย่างไฟล์ 'number':

$_FILES['file']['tmp_name'][0]

คุณสามารถใช้การนับ php () เพื่อนับจำนวนไฟล์ที่เลือก Goodluck widdit!


5
ขอบคุณสำหรับทิป! มันช่วยฉันได้มากเวลา +1
BPm

ใช้งานได้ดีมาก ... แต่ฉันมีปัญหาในการอัปโหลดด้วยวิธีนี้ใน Internet Explorer (v8) ฉันคิดว่า IE ไม่รองรับการอัปโหลดด้วยวิธีนี้
ทาเร็คเอ็มนาซิม

4
หรือคุณสามารถวนไฟล์ผ่านforeachคำสั่งโดยไม่ต้องทราบจำนวนไฟล์ที่อัพโหลด ...
ygesher

หมายเหตุหากคุณใช้รหัสในชื่อของคุณใน html เช่น name = "file [3]" คุณจะต้องเข้าถึงค่าผ่านทาง $ _FILES ['file'] ['tmp_name'] [3] ในกรณี ไม่ชัดเจน
MyStream

8

โซลูชันเต็มรูปแบบใน Firefox 5:

<html>
<head>
</head>
<body>
 <form name="uploader" id="uploader" action="multifile.php" method="POST" enctype="multipart/form-data" >
  <input id="infile" name="infile[]" type="file" onBlur="submit();" multiple="true" ></input> 
 </form>

<?php
echo "No. files uploaded : ".count($_FILES['infile']['name'])."<br>"; 


$uploadDir = "images/";
for ($i = 0; $i < count($_FILES['infile']['name']); $i++) {

 echo "File names : ".$_FILES['infile']['name'][$i]."<br>";
 $ext = substr(strrchr($_FILES['infile']['name'][$i], "."), 1); 

 // generate a random new file name to avoid name conflict
 $fPath = md5(rand() * time()) . ".$ext";

 echo "File paths : ".$_FILES['infile']['tmp_name'][$i]."<br>";
 $result = move_uploaded_file($_FILES['infile']['tmp_name'][$i], $uploadDir . $fPath);

 if (strlen($ext) > 0){
  echo "Uploaded ". $fPath ." succefully. <br>";
 }
}
echo "Upload complete.<br>";
?>

</body>
</html>

รหัสถูกตัด นี่คือสิ่งที่มาเพียงข้างต้นนั้น: <html> <head> </head> <body> <form name="uploader" id="uploader" action="multifile.php" method="POST" enctype="multipart/form-data" > <input id="infile" name="infile[]" type="file" onBlur="submit();" multiple="true" ></input> </form>
Thaps

3
แม้ว่ามันจะไม่ได้ทำงานใน IE8 แต่เพียงแค่ใช้เบราว์เซอร์จริง
Thaps

5

หากคุณต้องการเลือกหลายไฟล์จากกล่องโต้ตอบตัวเลือกไฟล์ที่แสดงเมื่อคุณเลือกเบราส์คุณจะโชคไม่ได้เลย คุณจะต้องใช้ Java applet หรือสิ่งที่คล้ายกัน (ฉันคิดว่ามีไฟล์ที่ใช้ไฟล์แฟลชขนาดเล็กฉันจะอัปเดตหากพบ) ปัจจุบันอินพุตไฟล์เดียวอนุญาตให้เลือกไฟล์เดียวเท่านั้น

หากคุณกำลังพูดถึงการใช้อินพุตไฟล์หลายไฟล์ก็ไม่ควรแตกต่างกันมากนักจากการใช้หนึ่งไฟล์ โพสต์รหัสและฉันจะพยายามช่วยเหลือเพิ่มเติม


อัปเดต: มีวิธีการหนึ่งวิธีในการใช้ปุ่ม 'เรียกดู' หนึ่งครั้งที่ใช้แฟลช ฉันไม่เคยใช้มันเป็นการส่วนตัว แต่ฉันได้อ่านจำนวนพอสมควรเกี่ยวกับเรื่องนี้ ฉันคิดว่ามันเป็นช็อตที่ดีที่สุดของคุณ

http://swfupload.org/


1
ฉันเพิ่มลิงค์ไปยังโปรแกรมอัปโหลดหลายตัวที่ใช้แฟลช
MitMaro

ฉันเคยใช้ swfupload fwiw - มันเป็นความเจ็บปวดเล็กน้อยในบางโอกาส แต่มันก็ไม่ยากที่จะทำงาน
Meep3D

@ Barsoom ถูกต้อง สิ่งที่ดีขึ้นมากในการอัปโหลดไฟล์หลายไฟล์ในช่วงสองสามปีที่ผ่านมา : D
MitMaro

4

ในครั้งแรกที่คุณควรทำแบบนี้:

<form method="post" enctype="multipart/form-data" >
   <input type="file" name="file[]" multiple id="file"/>
   <input type="submit" name="ok"  />
</form> 

ถูกต้องแล้ว . ตอนนี้เพิ่มรหัสนี้ภายใต้รหัสแบบฟอร์มของคุณหรือในหน้าใด ๆ ที่คุณต้องการ

<?php
if(isset($_POST['ok']))
   foreach ($_FILES['file']['name'] as $filename) {
    echo $filename.'<br/>';
}
?>

ง่าย ... เสร็จแล้ว


1

หากคุณใช้ฟิลด์ป้อนข้อมูลหลายช่องคุณสามารถตั้งค่า name = "file []" (หรือชื่ออื่น ๆ ) ที่จะทำให้พวกเขาอยู่ในอาร์เรย์เมื่อคุณอัปโหลด ( $_FILES['file'] = array ({file_array},{file_array]..))


1
<form action="" method="POST" enctype="multipart/form-data">
  Select image to upload:
  <input type="file"   name="file[]" multiple/>
  <input type="submit" name="submit" value="Upload Image" />
</form>

ใช้สำหรับวง

<?php    
  $file_dir  = "uploads";    
  if (isset($_POST["submit"])) {

    for ($x = 0; $x < count($_FILES['file']['name']); $x++) {               

      $file_name   = $_FILES['file']['name'][$x];
      $file_tmp    = $_FILES['file']['tmp_name'][$x];

      /* location file save */
      $file_target = $file_dir . DIRECTORY_SEPARATOR . $file_name; /* DIRECTORY_SEPARATOR = / or \ */

      if (move_uploaded_file($file_tmp, $file_target)) {                        
        echo "{$file_name} has been uploaded. <br />";                      
      } else {                      
        echo "Sorry, there was an error uploading {$file_name}.";                               
      }                 

    }               
  }    
?>

ใช้ FOREACH Loop

<?php
  $file_dir  = "uploads";    
  if (isset($_POST["submit"])) {

    foreach ($_FILES['file']['name'] as $key => $value) {                   

      $file_name   = $_FILES['file']['name'][$key];
      $file_tmp    = $_FILES['file']['tmp_name'][$key];

      /* location file save */
      $file_target = $file_dir . DIRECTORY_SEPARATOR . $file_name; /* DIRECTORY_SEPARATOR = / or \ */

      if (move_uploaded_file($file_tmp, $file_target)) {                        
        echo "{$file_name} has been uploaded. <br />";                      
      } else {                      
        echo "Sorry, there was an error uploading {$file_name}.";                               
      }                 

    }               
  }
?>

0

ฉันได้สร้างฟังก์ชั่น php ซึ่งใช้ในการอัปโหลดภาพหลายภาพฟังก์ชั่นนี้สามารถอัปโหลดภาพหลายภาพในโฟลเดอร์ที่เฉพาะเจาะจงเช่นกันมันสามารถบันทึกบันทึกลงในฐานข้อมูลในรหัสต่อไปนี้ $ arrayimage คืออาร์เรย์ของภาพ มันจะไม่อนุญาตให้อัพโหลดใช้หลาย ๆ อัน แต่คุณต้องสร้างฟิลด์อินพุตที่ต่างกันด้วยชื่อเดียวกับที่คุณจะสามารถตั้งค่าฟิลด์เพิ่มแบบไดนามิกของการคลายไฟล์เมื่อคลิกปุ่ม

$ dir เป็นไดเรกทอรีที่คุณต้องการบันทึกอิมเมจ $ field เป็นชื่อของฟิลด์ที่คุณต้องการเก็บไว้ในฐานข้อมูล

เขตข้อมูลฐานข้อมูลจะต้องอยู่ในรูปแบบอาร์เรย์ตัวอย่างถ้าคุณมีฐานข้อมูลภาพและชื่อเขตข้อมูลเช่นรหัสชื่อที่อยู่คุณต้องโพสต์ข้อมูลเช่น

$fields=array("id"=$_POST['idfieldname'], "name"=$_POST['namefield'],"address"=$_POST['addressfield']);

แล้วส่งฟิลด์นั้นไปยังฟิลด์ $ ของฟังก์ชัน

$ table คือชื่อของตารางที่คุณต้องการจัดเก็บข้อมูล ..

function multipleImageUpload($arrayimage,$dir,$fields,$table)
{
    //extracting extension of uploaded file
    $allowedExts = array("gif", "jpeg", "jpg", "png");
    $temp = explode(".", $arrayimage["name"]);
    $extension = end($temp);

    //validating image
    if ((($arrayimage["type"] == "image/gif")
    || ($arrayimage["type"] == "image/jpeg")
    || ($arrayimage["type"] == "image/jpg")
    || ($arrayimage["type"] == "image/pjpeg")
    || ($arrayimage["type"] == "image/x-png")
    || ($arrayimage["type"] == "image/png"))

    //check image size

    && ($arrayimage["size"] < 20000000)

    //check iamge extension in above created extension array
    && in_array($extension, $allowedExts)) 
    {
        if ($arrayimage["error"] > 0) 
        {
            echo "Error: " . $arrayimage["error"] . "<br>";
        } 
        else 
        {
            echo "Upload: " . $arrayimage["name"] . "<br>";
            echo "Type: " . $arrayimage["type"] . "<br>";
            echo "Size: " . ($arrayimage["size"] / 1024) . " kB<br>";
            echo "Stored in: ".$arrayimage['tmp_name']."<br>";

            //check if file is exist in folder of not
            if (file_exists($dir."/".$arrayimage["name"])) 
            {
                echo $arrayimage['name'] . " already exists. ";
            } 
            else 
            {
                //extracting database fields and value
                foreach($fields as $key=>$val)
                {
                    $f[]=$key;
                    $v[]=$val;
                    $fi=implode(",",$f);
                    $value=implode("','",$v);
                }
                //dynamic sql for inserting data into any table
                $sql="INSERT INTO " . $table ."(".$fi.") VALUES ('".$value."')";
                //echo $sql;
                $imginsquery=mysql_query($sql);
                move_uploaded_file($arrayimage["tmp_name"],$dir."/".$arrayimage['name']);
                echo "<br> Stored in: " .$dir ."/ Folder <br>";

            }
        }
    } 
    //if file not match with extension
    else 
    {
        echo "Invalid file";
    }
}
//function imageUpload ends here
}

// imageFunctions class สิ้นสุดที่นี่

คุณสามารถลองใช้รหัสนี้เพื่อแทรกรูปภาพหลาย ๆ รูปพร้อมกับส่วนขยายฟังก์ชันนี้สร้างขึ้นเพื่อตรวจสอบไฟล์รูปภาพคุณสามารถแทนที่รายการส่วนขยายสำหรับไฟล์ perticular ในรหัส


สวัสดีทุกคนฉันใช้อินพุตไฟล์เพื่อแนบเอกสารกับอีเมลที่สร้างอัตโนมัติ ฉันสามารถแนบเอกสารหลายชุดได้ในระหว่างการเดินทางอย่างไรก็ตามฉันต้องการแนบเอกสารหลายชุดจากไดเรกทอรีที่แตกต่าง ปัจจุบันถ้าฉันทำสิ่งนี้เอกสารที่เลือกในปัจจุบันของฉันจะถูกแทนที่ด้วยเอกสารใหม่ที่ฉันเลือก ได้โปรดฉันจะไปเกี่ยวกับเรื่องนี้ได้อย่างไร ขอบคุณ
Kunbi

-1

คำตอบบางส่วน: แพร์ HTTP_UPLOAD สามารถเป็นประโยชน์ได้ http://pear.php.net/manual/th/package.http.http-upload.examples.php

มีตัวอย่างเต็มรูปแบบสำหรับหลายไฟล์


1
คุณสามารถใช้แพคเกจลูกแพร์ แต่งานนี้ค่อนข้างเล็กน้อยและถ้าคุณต้องการคุณสมบัติพิเศษที่แพคเกจให้ (ข้อความแสดงข้อผิดพลาดสากลตรวจสอบ ฯลฯ ... ) ฉันอยากจะแนะนำให้ใช้ฟังก์ชั่น PHP พื้นเมือง แต่นี่เป็นเพียงความคิดเห็นของฉัน :)
MitMaro

ฉันเห็นด้วยกับคุณนั่นเป็นเหตุผลที่ฉันเขียนว่า "คำตอบบางส่วน" แต่ฉันก็ทำดีที่สุดของฉันไปที่รหัสกลับมาใช้และฉันมักจะทำงานเท่าที่ฉันสามารถมีลูกแพร์ (coders ลูกแพร์มีมากดีกว่าค่ะ :-D)
damko
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.