php实现文件上传

来源：互联网发布：java中class的作用编辑：程序博客网时间：2024/05/19 00:51

上次在看了一篇文章实现了前端的图片预览，这次做一个php实现文件的上传功能，发现代码太久没敲都忘了好多，中间出了好多问题？在此谨记；
首先我们创建两个文件，1个前端的模板文件，另一个就是PHP文件了。
在前端文件上我们要写一个form表单了，我们这个是上传文件的所以别忘了在里面加上怎么一句话enctype="multipart/form-data"，要不然你文件是上传不上去的。
好了现在前端写完了，我们现在来高后端，因为我们是post传递，所以我们要判断是不是post提交的//判断是否是post方式提交 if(!$_SERVER['REQUEST_METHOD']=='POST'){ echo '不是post提交'; }，用来$file=$_FILE['file'];接收我们传过来的数据，而且我们判断这个文件是否存在。现在我们的文件已经存到了我们的临时服务器了，我们要判断一下它是不是图片类型的，$type=$_FILES['file']['type'];这句我们是用来获取他的类型的，不过我们要处理以下才能得到他的真实格式的$type=explode('/',$type)[1];// jpg，要开始判断//判断是否是图片文件 $typeList=array('jpg','jpeg','png','bmp'); if(!in_array($type,$typeList)) { echo '非法的文件格式'; exit(); }，现在出来的已经是我们图片格式的文件了，我们之后要做的工作就是把文件从临时缓存那移动过来。

  //移动文件//判断  upload下是否存在该文件if(file_exists('upload/'.$_FILES['file']['name'])){      echo '文件已经存在';      exit();}//$_FILES['file']['name'] = iconv("UTF-8","gb2312",$_FILES['file']['name'])//这个iconv()里面有3个值，一是现在使用的编码格式，二是想要转换的编码格式，三是想要转化的字符串//如果upload下文件不存在，则移入else{    //注意参数问题    $res=move_uploaded_file($_FILES['file']['tmp_name'],'./upload/'.date('YmdHis').$_FILES['file']['name']);    if(!$res){        echo '文件上传失败';        exit();    }    echo '文件已上传';}

至此我们已经把文件存到我们的文件夹底下了，是不是很愉快，回头想想是不是什么东西忘了，哦，原来前端的图片预览还没写，不说放代码。

<!DOCTYPE html><html lang="en"><head>  <meta charset="UTF-8">  <title>文件上传</title>  <style>  .uploadView{     width: 300px;     height: 400px;     border: 1px solid lightgrey;  }</style></head><body>   <form action="file.php" method="post" enctype="multipart/form-data">    <input type="file" name="file"   id="fileChange" >    <input type="submit" value="上传文件"></form><div class="uploadView"><img src="" alt="" width="300px" id="img"></div></body><script type="text/javascript">window.onload=function() {     var submit=document.querySelector('#fileChange');     var img=document.getElementById('img');     submit.onchange= function (){//       alert('a');                //得到一个参数列表                var files=!!this.files? this.files:[];                //如果没有选择任何文件或者督导任何文件则返回                if(! files.length || !window.FileReader){                    return;                }                //只有图片才会读进来                if(/^image/.test( files[0].type)){                  //创建一个新的fileRead实例                  var reader=new FileReader();                  //读取本地文件作为一个DataUrl                  reader.readAsDataURL(files[0]);                  //图片加载                  reader.onload=function(e) {//                      var src=this.result.split(',')[1];                     img.src= this.result;                     console.log(img);//                     console.log( this.result);                  }            }               else {                    alert('请输入图片');               }     }}</script></html>

总结：做这个的时候遇到了两个比较大的问题，都是自己的粗心造成了，其实也就是自己不熟悉的原因。第一个问题：就是我在移动文件的时候$res=move_uploaded_file($_FILES['file']['tmp_name'],'./upload/'.date('YmdHis').$_FILES['file']['name']);把move_upload_file()函数的第一个参数写错了，写成了$_FILES[‘file’][‘name’],然后一直返回false，弄的我一脸蒙蔽。第二个问题就是前端页面设置 img的src出错了，脑子里一致以为是 img.style.src=”;导致图片出不来，其实是 img.src=”就可以了。把style弄混了，style是样式的内容。这里写图片描述

阅读全文

0 0