PHP和HTML5是網站開發中非常常用的兩種技術，文件上傳是網站中的一個重要功能，那么如何使用PHP和HTML5實現文件上傳呢？本文將為大家詳細介紹。 在網站中，我們往往需要用戶上傳文件，比如用戶頭像、用戶資料等等。文件上傳的實現方式有很多，最常用的方式是使用表單的方式，用戶通過表單提交文件，接收者通過接收表單數據，將文件進行保存。下面是一個簡單的文件上傳表單。

<form action="upload.php" method="post" enctype="multipart/form-data">
<p>選擇文件:</p>
<p><input type="file" name="fileToUpload" id="fileToUpload"></p>
<p><input type="submit" value="上傳文件" name="submit"></p>
</form>

上述代碼中，form標簽的enctype屬性值為multipart/form-data，需要加上這個屬性值才能傳輸二進制文件。 下面是upload.php文件的代碼：

<?php
$target_dir = "uploads/"; //設置上傳目錄
$uploadOk = 1; //上傳標志位默認為1
$target_file = $target_dir . basename($_FILES["fileToUpload"]["name"]); //設置上傳文件的目標文件名
$imageFileType = strtolower(pathinfo($target_file,PATHINFO_EXTENSION)); //獲取上傳文件的擴展名
// 檢查文件是否真的是一個文件
if(isset($_POST["submit"])) {
$check = getimagesize($_FILES["fileToUpload"]["tmp_name"]);
if($check !== false) {
echo "文件是一個圖片 - " . $check["mime"] . ".";
$uploadOk = 1;
} else {
echo "文件不是圖片.";
$uploadOk = 0;
}
}
// 檢查文件是否已經存在
if (file_exists($target_file)) {
echo "文件已經存在.";
$uploadOk = 0;
}
// 檢查文件的大小
if ($_FILES["fileToUpload"]["size"] >500000) {
echo "文件太大了.";
$uploadOk = 0;
}
// 允許上傳的文件類型
if($imageFileType != "jpg" && $imageFileType != "png" && $imageFileType != "jpeg"
&& $imageFileType != "gif" ) {
echo "只允許上傳jpg, jpeg, png 和 gif的文件.";
$uploadOk = 0;
}
// 檢查上傳標志位是否為0
if ($uploadOk == 0) {
echo "文件沒有上傳.";
// 如果上傳標志位為1，上傳文件
} else {
if (move_uploaded_file($_FILES["fileToUpload"]["tmp_name"], $target_file)) {
echo "文件 ". basename( $_FILES["fileToUpload"]["name"]). " 已經上傳成功.";
} else {
echo "文件上傳失敗.";
}
}
?>

upload.php文件主要是接收表單提交的文件，然后進行一系列的判斷，比如上傳的文件太大，上傳的文件類型不符等等。最后將上傳的文件保存到指定目錄中。 在HTML5中，我們可以使用File API的FileReader對象來實現預覽上傳的圖片。下面是一個簡單的HTML5文件上傳預覽例子。

<div>
<input type="file" name="picture" id="picture">
</div>
<div>
<img src="#" id="preview" alt="">
</div>
<script type='text/javascript'>
$(function() {
$("#picture").on("change",function(event){
// 選擇的文件
var file = event.target.files[0];
var reader = new FileReader();
// 讀取文件
reader.readAsDataURL(file);
reader.onload = function(e){
// 顯示預覽
$("#preview").attr("src",e.target.result);
}
});
});
</script>

上述代碼中，我們通過FileReader對象讀取上傳的文件，然后通過獲取的結果進行預覽。這樣用戶可以在上傳文件之后，看到文件的預覽效果，從而更好的進行確認。 使用PHP和HTML5實現文件上傳，可以為網站開發帶來很多便利和優勢。通過本文的介紹，相信大家已經掌握了文件上傳的基本開發技能，實踐起來也是非常簡單易懂。