js判斷上傳圖片文件大小，尺寸，格式

/**
 * 文件寬高
 * @param eventId id
 * @param w 寬度
 * @param h 高度
 * @param callback 回調函數
這里判斷圖片像素的方法是異步的，所以需要在回調函數中來進行上傳的操作
 */
function testImgWidthHeight(eventId, w,h,callback){
    var input = document.getElementById(eventId);
    if(input.files){
        //讀取圖片數據
        var f = input.files[0];
        var reader = new FileReader();
        reader.onload = function (e) {
            var data = e.target.result;
            //加載圖片獲取圖片真實寬度和高度
            var image = new Image();
            image.onload=function(){
                var width = image.width;
                var height = image.height;
                if (width != w || height != h) {
                    //隱藏
                    input.value="";
                    callback && callback(false);
                } else {
                    callback && callback(true);
                }
            };
            image.src= data;
        };
        reader.readAsDataURL(f);

    }else{
        var image = new Image();
        image.onload =function(){
            var width = image.width;
            var height = image.height;
            var fileSize = image.fileSize;
            alert(width+'===2==='+height+"====="+fileSize);
        }
        image.src = input.value;
    }
}

/**
 *文件大小
 * @param fileData
 * @param Max_Size
 * @returns {boolean}
 */
function testMaxSize(fileData,Max_Size){
       var isAllow=false;
      var size = fileData.size;
      isAllow = size <= Max_Size;
      if(!isAllow){
         vue.$message({
            message: '圖片大小超過限制！',
            type: 'warning'
         });
      }
       return isAllow;
}
/**
 * 判斷圖片類型
 * @param eventId
 * @param gif|jpg|jpeg|png|GIF|JPG|PNG
 * @returns {boolean}
 */
function testImgType(eventId) {
   var tmpFile = document.getElementById(eventId);
   if (!/\.(jpg)$/.test(tmpFile.value)) {
      tmpFile.value= "";
      vue.$message({
         message: '圖片格式不正確！',
         type: 'warning'
      });
      return false;
   }
   return true;
}

　　　　　　　　//上傳圖片
               getFile(event) {
                   let eventId = event.target.id;
                   let type=  testImgType(eventId);
                   if(!type){
                       return;
                   }
                   let max = testMaxSize(event.target.files[0],1024*3*1024);
                   if(!max){
                       vue.$message({
                           message: '圖片大小超過限制！',
                           type: 'warning'
                       });
                       return;
                   }
                   var _this =this;//回調函數this指向
                   let width = 1920;
                   let height = 1080;
                   if(eventId=="img5" || eventId=="img6" || eventId=="img7" || eventId=="img8" ){
                       width =1080;
                       height=1920;
                   }
                   let widthImg = testImgWidthHeight(eventId,width,height,function (res) {
                       if (!res) {
                           vue.$message({
                               message: '圖片尺寸不正確！',
                               type: 'warning'
                           });
                       }else {
                           //上傳請求的邏輯，在回調函數中進行處理；
                           let formData = new FormData();
                           formData.append('file', event.target.files[0]);
                           let config = {
                               headers: {
                                   'Content-Type': 'multipart/form-data'
                               }
                           }
                           _this.$http.post([[@{/common/uploadFile}]], formData, config).then(function (res) {
                               if (res.data.code == '000') {
                                   if(eventId=='img1' || eventId=='img2' ){
                                       _this.designUserList[0].cardImg=res.data.data;
                                   }
                               }
                           })

　　　　　　　　　　　　　　　　　　}

　　　　　　　　　　　　　　　　　　});

　　　　　　　　　　　　　　　　　　　　},