webuploader 实现大文件 分片上传

webuploader 分片上传文件

最近研究了下大文件上传的方法，找到了webuploader js 插件进行大文件上传。

使用

 使用webuploader分成简单直选要引入

<!--引入CSS-->
<link rel="stylesheet" type="text/css" href="webuploader文件夹/webuploader.css">

<!--引入JS-->
<script type="text/javascript" src="webuploader文件夹/webuploader.js"></script>

HTML部分

<div id="uploader" class="wu-example">
    <!--用来存放文件信息-->
    <div id="thelist" class="uploader-list"></div>
    <div class="btns">
        <div id="picker">选择文件</div>
        <button id="ctlBtn" class="btn btn-default">开始上传            </button>
    </div>
    </div>

初始化Web Uploader

jQuery(function() {
   
        $list = $('#thelist'),
            $btn = $('#ctlBtn'),
            state = 'pending',
            uploader;

        uploader = WebUploader.create({
            // 不压缩image
            resize: false,
            // swf文件路径
            swf: 'uploader.swf',
            // 文件接收服务端。
            server: upload.php,
            // 选择文件的按钮。可选。
            // 内部根据当前运行是创建，可能是input元素，也可能是flash.
            pick: '#picker',
            chunked: true,
            chunkSize:2*1024*1024,
            auto: true,
            accept: {
                title: 'Images',
                extensions: 'gif,jpg,jpeg,bmp,png',
                mimeTypes