處理圖片流資料

mazhenxiao發表於2019-04-15

處理二進位制流圖片資料

  • 使用xml.responseType = "blob"; 請求返回blob資料流
  • 使用window.URL.createObjectURL(this.response);處理為定址資料
  • 在載入完成後解除安裝window.URL.revokeObjectURL(tar.src)；節省記憶體
        loadImg(item,ev){
            let url =URL.APIURL(`UniversalMarketing/Project/LoadImage?filename=110.png`);
            let tar = ev.target
            let me = tar.classList;
             if(!me.contains("show")){
                 let xml = new XMLHttpRequest();
                     xml.withCredentials = true;
                     xml.responseType = "blob";
                     xml.open("GET",url);
                     xml.addEventListener("readystatechange",function(d){
                         if(this.status==200&&this.response){
                             tar.src = window.URL.createObjectURL(this.response);
                             tar.classList.add("show");
                             
                         }
                     })
                        xml.send(null);
               
            }else{
                window.URL.revokeObjectURL(tar.src)
            }
            return;
            
        }
複製程式碼

相關文章