webuploader大小限制

文章來源：https://www.cnblogs.com/huangleilei/p/6931934.html

使用webuploader上傳圖片，對格式大小有限制。 
下面是我是用中的一些總結，有不對的地方，希望大佬們指出。 
廢話不多說，下面正文 
文件大小限制

fileNumLimit: xx,//上傳數量限制
fileSizeLimit: xx,//限制上傳所有文件大小
fileSingleSizeLimit: xx,//限制上傳單個文件大小

　　

accept: {// 只允許選擇圖片文件格式

    title: 'Images',
    extensions: 'gif,jpg,bmp,png',
    mimeTypes: 'image/*'
},

提示信息 

type是錯誤編碼。不清楚的錯誤可以打印出來看一下，使用的layer彈出提示、可以改的。

/**
* 驗證文件格式以及文件大小
*/
uploader.on("error", function (type) {
    if (type == "Q_TYPE_DENIED") {
        layer.msg("請上傳JPG、PNG、GIF、BMP格式文件");
    } else if (type == "Q_EXCEED_SIZE_LIMIT") {
        layer.msg("文件大小不能超過2M");
    }else {
            layer.msg("上傳出錯！請檢查后重新上傳！錯誤代碼"+type);
    }
});

一些錯誤

我碰到還一種情況是要初始化的空間隱藏狀態，控件沒有初始化。解決方法是在控件顯示出來后在調用一次函數，就是在初始化一次。

單張圖片上傳完后，想要修改再次上傳圖片是沒有效果，我在網上查找到了 說加上duplicate: true 
但是我的還是沒有效果，解決方法是上傳完成后再次初始化控件。

源碼如下，有明白問什么都同學還請告知一二。 
下面貼出全部代碼。僅供參考

/**
 * @param url 地址
 * @param num 上傳數量
 * @param totalSize 限制上傳所有文件大小
 * @param singleSize 限制上傳單個文件大小
 */
function initWebuploader(url,num,totalSize,singleSize,rootPath) {
    uploader = WebUploader.create({
        fileNumLimit: num,//上傳數量限制
        fileSizeLimit: totalSize,//限制上傳所有文件大小
        fileSingleSizeLimit: singleSize,//限制上傳單個文件大小
        auto: true,
        // swf文件路徑
        // swf: BASE_URL + '/js/Uploader.swf',
        // 文件接收服務端。
        server: url,
        // 選擇文件的按鈕。可選。
        // 內部根據當前運行是創建，可能是input元素，也可能是flash.
        pick: '#picker',
        // 不壓縮image, 默認如果是jpeg，文件上傳前會壓縮一把再上傳！
        resize: false,//重復上傳
　　　　　
　　　　　fileSingleSizeLimit:2*1024*1024,//上傳限制2M
        accept: {// 只允許選擇圖片文件格式
         title: 'Images',
         extensions: 'gif,jpg,bmp,png',
         mimeTypes: 'image/*'
         },
        duplicate: true
    });
    //上傳每個文件之前設置額外參數
    uploader.on("uploadStart", function () {
    });
    uploader.on("startUpload", function () {
    });
    uploader.on("uploadSuccess", function (file, response) {
        $("#imgView").attr("src", rootPath + response);
        $("#photo").val(response);
        layer.msg("上傳成功");
    });
    uploader.on("uploadFinished", function () {
        //layer.msg("上傳成功")
        //多次上傳，頁面使用webuploader1來調用，實現多次上傳效果
        // function initWebuploader1() {
         //    initWebuploader(...);
        // }
        uploader.destroy();
        initWebuploader(url,num,totalSize,singleSize,rootPath);
    });
    /**
     * 驗證文件格式以及文件大小
     */
    uploader.on("error", function (type) {
        if (type == "Q_TYPE_DENIED") {
            layer.msg("請上傳JPG、PNG、GIF、BMP格式文件");
        } else if (type == "Q_EXCEED_SIZE_LIMIT") {
            layer.msg("文件大小不能超過2M");
        }else {
            layer.msg("上傳出錯！請檢查后重新上傳！錯誤代碼"+type);
        }

    });
}