php文件上傳小結及uploadifive的基本使用

本篇對 不使用框架實現php上傳 和 使用uploadifive框架進行了小結

不使用框架實現文件上傳

簡單看了下菜鳥教程上的demo
文件結構如下圖

form.html

<form action="upload_file.php" method="post" enctype="multipart/form-data">
    <label for="file">文件名:</label>
    <input type="file" name="file" id="file"><br>
    <input type="submit" name="submit" value="提交">
</form>

最基本的表單，不多說

upload_file.php

//允許上傳的圖片後綴
$allowedExts = array("gif","jpeg","jpg","png","doc");
$temp = explode(".",$_FILES["file"]["name"]);
echo $_FILES["file"]["size"];
$extension = end($temp);
if((($_FILES["file"]["type"] == "images/gif")
    ||($_FILES["file"]["type"] == "image/jpeg")
    ||($_FILES["file"]["type"] == "image/jpg")
    ||($_FILES["file"]["type"] == "image/pjpeg")
    ||($_FILES["file"]["type"] == "image/x-png")
    ||($_FILES["file"]["type"] == "image/png")
    ||($_FILES["file"]["type"] == "application/msword"))
    &&($_FILES["file"]["size"] < 204800)
    && in_array($extension,$allowedExts)){

    if($_FILES["file"]["error"] > 0){
        echo "錯誤：: ".$_FILES["file"]["error"]."<br>";
    }else{
        echo "上傳文件名: ".$_FILES["file"]["name"]."<br>";
        echo "文件類型: ".$_FILES["file"]["type"]."<br>";
        echo "文件大小: ".($_FILES["file"]["size"]/1024)."kB<br>";
        echo "文件臨時存儲的位置: ".$_FILES["file"]["tmp_name"]."<br>";

        //判斷當前目錄下的upload目錄是否存在
        //如果沒有upload目錄, 你需要創建它，upload目錄權限爲 777
        if(file_exists("upload/".$_FILES["file"]["name"])){
            echo $_FILES["file"]["name"]."文件已經存在。";
        }else{
            //如果upload 目錄不存在該文件則將文件上傳到upload目錄上s
            move_uploaded_file($_FILES["file"]["tmp_name"],"upload/".$_FILES["file"]["name"]);
            echo "文件存儲在: "."upload/".$_FILES["file"]["name"];
        }
    }
}else{
    echo "非法的文件格式";
}

也很好理解，核心函數只有一個move_uploaded_file()，其它的代碼都是些爲篩選做準備的語句，也很容易理解。

方法介紹

bool move_uploaded_file ( string $filename , string $destination )

作用：
  將上傳文件移動到新的位置。本函數檢查並確保由 filename 指定的文件是合法的上傳文件（即通過 PHP 的 HTTP POST 上傳機制所上傳的）。如果文件合法，則將其移動爲由 destination 指定的文件。

參數介紹：

$filename:上傳文件的文件名

$destination:移動文件到這個位置

使用uploadifive框架實現文件上傳

1. 引入所需要的框架文件

<script src="../js/jquery-3.3.1.min.js" type="text/javascript"></script>
<script src="jquery.uploadifive.min.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="uploadifive.css">

jquery和uploadifive的相關文件，沒有可去官網下載或者找demo中文件。

1. 創建表單

    <form>
        <div id="queue"></div>
        <input id="file_upload" name="file_upload" type="file" multiple="true">
    </form>

1. 在js中使用框架

<script type="text/javascript">
        <?php $timestamp = time();?>
        $(function () {
            $('#file_upload').uploadifive({
                'auto' : true,          //是否自動上傳，默認true
                'checkScript' : '\.\/js\/uploadify\/check-exists.php', //檢查文件路徑
                'formData' : {
                    'timestamp' : '<?php echo $timestamp;?>',
                    'token' : '<?php echo md5('unique_salt'.$timestamp);?>',
                },
                'onInit' :  function(){
                    $('div.uploadifive-button').show();
                },
                'queueID' : 'queue',   //進度條的顯示位置
                'uploadScript' : 'demo\/uploadifive.php',       //上傳路徑腳本
                'onUploadComplete' : function(file,data){  //文件上傳成功後執行
//                    console.log(file);
                },
                'onError'      : function(errorType) {
                    console.log(errorType);
                    var msg = '文件上傳有誤';
                    switch(errorType) {
                        case 'FORBIDDEN_FILE_TYPE':
                            msg = '錯誤的上傳文件類型';
                            break;

                    }
                    alert('錯誤提示: ' + msg);
                }
            });
        });

    </script>

本例子只使用了最基本一些屬性，實現了基本的上傳功能，如果需要更多的屬性，可自己去官網查閱，也可以在本篇的參考1中看他人已經總結過的常用的。

最近後臺用到了文件上傳，項目中使用的是uploadifive框架，參考網上一些鏈接總結了下

菜鳥教程：http://www.runoob.com/php/php-file-upload.html
兩篇參考博客: 參考1 、參考2