PHP简单实现切片上传

最新推荐文章于 2024-08-22 16:31:01 发布

LMXQH

最新推荐文章于 2024-08-22 16:31:01 发布

阅读量2.3k

点赞数

分类专栏： PHP 前端笔记

本文链接：https://blog.csdn.net/LMXQH/article/details/86108435

版权

这篇博客记录了如何使用PHP实现文件切片上传的过程。首先，前端通过监听上传按钮onchange事件，获取文件并切割，然后附加到FORMDATA对象中通过AJAX发送到服务器。在PHP端，创建上传文件夹，接收文件块并移动到指定位置，待所有块上传完毕后进行文件合并，最后删除临时文件夹并返回上传文件路径。

摘要由CSDN通过智能技术生成

本篇仅作记录，不做教程，若需要详细讲解，请参考其它文章。

实现思路：

JS思路
1.监听上传按钮的onchange事件
2.获取文件的FILE对象
3.把文件的FILE对象进行切割，并且附加到FORMDATA对象中
4.把FORMDATA对象通过AJAX发送到服务器
5.重复3、4步骤，直到文件发送完。

PHP思路
1.建立上传文件夹
2.把文件从上传临时目录移动到上传文件夹
3.所有的文件块上传完成后，进行文件合成
4.删除文件夹
5.返回上传后的文件路径

前端代码：

<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
        #progress{
            width: 300px;
            height: 20px;
            background-color:#f7f7f7;
            box-shadow:inset 0 1px 2px rgba(0,0,0,0.1);
            border-radius:4px;
            background-image:linear-gradient(to bottom,#f5f5f5,#f9f9f9);
        }

        #finish{
            background-color: #149bdf;
            background-image:linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);
            background-size:40px 40px;
            display: inline-block;
            height: 20px;
        }

        form{
            margin-top: 50px;
        }
    </style>

</head>

<body>

<p id="progress">
    <span id="finish" style="width: 0%;"