vue上传文件php,php文件上传 – 前端开发，JQUERY特效，全栈开发，vue开发

文件上传一般有下面2种方式：

有两种：

1、标准input表单方式，典型的用$_FILES进行接收；

2、以Base64的方式进行传送，一般是AJAX异步上传。

第一种

标准的input表单方式，适用于大文件进行上传，同时支持批量。html代码关键的几句：

不同的name时：

其中enctype="multipart/form-data"对于文件上传是必不可少的。另外type="file"设置input类型，accept="image/*"指定优先上传图片(MIME 参考手册)。multiple支持一次选多个文件，pic[]以数组的形式接收多个文件。手机端端还可以加入参数capture="camera"选择摄像头拍照上传。

后端处理：

通过$_FILES获取上传的文件。

$files = $_FILES;

传多个文件时，如果name不同，则返回的$_FILES数组格式不同。

name相同时：

array(1) {

["id_pic"] => array(5) {

["name"] => array(2) {

[0] => string(5) "1.jpg"

[1] => string(5) "2.jpg"

}

["type"] => array(2) {

[0] => string(10) "image/jpeg"

[1] => string(10) "image/jpeg"

}

["tmp_name"] => array(2) {

[0] => string(27) "C:\Windows\Temp\php7A7E.tmp"

[1] => string(27) "C:\Windows\Temp\php7A7F.tmp"

}

["error"] => array(2) {

[0] => int(0)

[1] => int(0)

}

["size"] => array(2) {

[0] => int(77357)

[1] => int(56720)

}

}

}

name不相同时：

array(2) {

["id_pic_1"] => array(5) {

["name"] => string(5) "1.jpg"

["type"] => string(10) "image/jpeg"

["tmp_name"] => string(27) "C:\Windows\Temp\phpBBEE.tmp"

["error"] => int(0)

["size"] => int(77357)

}

["id_pic_2"] => array(5) {

["name"] => string(5) "2.jpg"

["type"] => string(10) "image/jpeg"

["tmp_name"] => string(27) "C:\Windows\Temp\phpBBEF.tmp"

["error"] => int(0)

["size"] => int(56720)

}

}

在对$_FILES进行foreach遍历时，前面那种输出格式不大方便。后面那种就可以直接遍历。我们可以写个方法进行统一转换：

function dealFiles($files) {

$fileArray = array();

$n = 0;

foreach ($files as $key=>$file){

if(is_array($file['name'])) {

$keys = array_keys($file);

$count = count($file['name']);

for ($i=0; $i

$fileArray[$n]['key'] = $key;

foreach ($keys as $_key){

$fileArray[$n][$_key] = $file[$_key][$i];

}

$n++;

}

}else{

$fileArray = $files;

break;

}

}

return $fileArray;

}

好，前面讲到后端如何处理接收到的$_FILES数组，并转换成统一格式。接下来任务主要是：

1、检测上传的文件是否非法；

2、检测上传的文件是否超过大小；

3、检测保存的路径是否存在，是否可写；

4、文件重命名；

其中上传过程中用到了个很重要的函数：move_uploaded_file(filename , $destination )进行文件移动操作。将$_FILES['id_pic']['tmp_name']移动到新的路径里。当然，移动前可以用is_uploaded_file($_FILES['id_pic']['tmp_name'])进行判断文件是否正常上传的。

多文件上传则是循环的方法多次使用move_uploaded_file()进行移动操作。

第二种

主要以上传图片为主。

利用input的change事件，借助canvas对图片进行处理(例如压缩)，然后ajax发送文件流到后端。

基本原理是通过canvas渲染图片，再通过 toDataURL 方法压缩保存为base64字符串(能够编译为jpg格式的图片)。

后端处理：

后端最终会收到前端发送的base64字符串，接着处理字符串为图片即可。具体请使用关键字base64 转 image 开发语言进行谷歌|百度。前端生成的结果中有一个base64Len，这是字符串的长度，后端应该核对以确认是否提交完整。参考：52fhy/localResizeIMG4: 前端本地客户端压缩图片，兼容IOS，Android，PC、自动按需加载文件

//php示例：

$img = base64_decode($_POST['img']);

$img = imagecreatefromstring($img);

作者：飞鸿影