बचत ब्लॉब Angular2

Question

में xlsx के रूप में मैं अपने Angular2 अनुप्रयोग में xlsx बचत के साथ कुछ मुद्दों है:

this._http.get('/api/file).subscribe(success=>{ 
       var blob = new Blob([success.json()], { 
        type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' 
       }); 
       var downloadUrl= window.URL.createObjectURL(blob); 
       window.open(downloadUrl); 

      }, error=>{ 

      }); 

प्रतिक्रिया मैं बैकएंड से प्राप्त निम्नलिखित रूप में है:

PK�q�H_rels/.rels���j�0��} 
�{㴃1F�^Ơ�2��l%1I,c�[��3�l 
l�����H��4��R�l��·����q}*�2�������;�*�� 
t"�^�l;1W)�N�iD)ejuD�cKz[׷:}g����@:�.... etc 

कोई भी विचार जहां मैं गलती कर रहा हूँ?

Answer 1

समस्या यह है कि बाइनरी प्रतिक्रिया सामग्री बॉक्स के बाहर समर्थित नहीं है।

: आप "मैन्युअल" अंतर्निहित एक्सएचआर वस्तु

पर प्रतिक्रिया प्रकार सेट करने के समाधान के लिए की जरूरत है, आप के रूप में अंतर्निहित XHR वस्तु पर नीचे वर्णित blob को responseType स्थापित करने के लिए Angular2 की BrowserXhr वर्ग का विस्तार करने की जरूरत है

import {Injectable} from 'angular2/core'; 
import {BrowserXhr} from 'angular2/http'; 

@Injectable() 
export class CustomBrowserXhr extends BrowserXhr { 
    constructor() {} 
    build(): any { 
    let xhr = super.build(); 
    xhr.responseType = "blob"; 
    return <any>(xhr); 
    } 
} 

प्रदाताओं में इस कक्षा को पंजीकृत करने के बाद सावधान रहें क्योंकि यह वैश्विक है। आपको इसे केवल उस घटक के भीतर सेट करना चाहिए जो अनुरोध निष्पादित करता है। आप मामले में, आप प्रतिक्रिया डेटा की एक स्ट्रिंग प्रतिनिधित्व प्राप्त ...

@Component({ 
    (...) 
    providers: [ 
    provide(BrowserXhr, { useClass: CustomBrowserXhr }) 
    ] 
}) 
export class ... 

तो फिर तुम प्रतिक्रिया ऑब्जेक्ट की _body संपत्ति से डेटा प्राप्त करने की जरूरत है।

this._http.get('/api/file).subscribe(success => { 
    var blob = new Blob([success._body], { 
       type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' 
    }); 
    var downloadUrl= window.URL.createObjectURL(blob); 
    window.open(downloadUrl); 
}, error=>{ 
    (...) 
}); 

अधिक जानकारी के लिए इस सवाल का देखें::

• Angular 2 download PDF from API and Display it in View