एंगुलरजेएस - सीएसवी

Question

प्राप्त करें और डाउनलोड करें मैं एक सर्वर के रूप में एक नोडजेएस प्रोग्राम और क्लाइंट के रूप में एक AngularJS वेब अनुप्रयोग का उपयोग कर रहा हूँ।

को परिभाषित करता है:

var app = express(); 
var csv = require('express-csv'); 

कोड प्राप्त करें:

सीएसवी मैं "व्यक्त-सीएसवी" पुस्तकालय का उपयोग कर रहा बनाने के लिए (https://www.npmjs.com/package/express-csv)

यहाँ मेरी सर्वर साइड कोड है

app.get('/exportDB', function(req, res){ 
    res.csv([ 
    ["a", "b", "c"] 
    , ["d", "e", "f"] 
    ]); 

यहां मेरा ग्राहक पक्ष कोड है:

$http.get("http://"+$localStorage.ip+":"+$localStorage.port+"/exportDB").success(function(response){ 
      // HERE I NEED A WAY TO DOWNLOAD THE RECEIVED CSV 
     }); 

यह कहने की जरूरत नहीं है कि यह सर्वर तक पहुंचता है और बाकी सब कुछ ठीक काम कर रहा है, लेकिन मुझे सीएसवी डाउनलोड करने का कोई तरीका नहीं मिला। कृपया मदद करें।

पी.एस

कृपया इसे Prompt a csv file to download as pop up using node.js and node-csv-parser (node module) का डुप्लिकेट है, के बाद से ग्राहक के पक्ष वास्तव में वहाँ उल्लेख नहीं है नहीं कहा है। इसके अलावा, अन्य प्रश्न क्लाइंट के बजाय सर्वर पक्ष पर केंद्रित हैं। AngularJS क्लाइंट का जिक्र करने वाला कोई अन्य प्रश्न नहीं है।

Answer 1

तुम बस नेविगेट कर सकते हैं:

location.href = "http://"+$localStorage.ip+":"+$localStorage.port+"/exportDB"; 

Answer 2

आपसे एक ऐसा टैग बना सकते हैं और उस पर क्लिक कर सकते हैं:

$http.get("http://"+$localStorage.ip+":"+$localStorage.port+"/exportDB").success(function(response) { 
     var dataURI = 'data:application/octet-stream;base64,' + btoa(response); 
     $('<a></a>').attr({ 
      download: 'db.csv', 
      href: dataURI 
     })[0].click(); 
    }); 

Answer 3

वहाँ सीएसवी को डाउनलोड करने के तरीके हैं। पहले दृष्टिकोण एक टैग बना सकते हैं और क्लिक करें यह

नीचे कोड डेटा में MIMETYPE जोड़े के लिए है: आवेदन/ओकटेट धारा

var a = document.createElement('a'); 
a.href = 'data:'+mimeType+';charset=utf-8;base64,' + response; 
a.target = '_blank'; 
a.download = "name the file here"; 
document.body.appendChild(a); 
a.click(); 

लेकिन इस समाधान आईई> 9 और सफारी पर काम नहीं करता> 6

क्योंकि सफारी एंकर टैग के लिए डाउनलोड विशेषता का पालन नहीं करता

तो सफारी के लिए आप filesaver.js

और IE इस solut उपयोग कर सकते हैं आयन काम करेगा

if (window.navigator.msSaveOrOpenBlob){ 
       // base64 string 
       var base64str = response; 

       // decode base64 string, remove space for IE compatibility 
       var newstr =base64str.replace(/\s/g, ''); 
       var binary = atob(newstr); 

       // get binary length 
       var len = binary.length; 

       // create ArrayBuffer with binary length 
       var buffer = new ArrayBuffer(len); 

       // create 8-bit Array 
       var view = new Uint8Array(buffer); 

       // save unicode of binary data into 8-bit Array 
       for (var i = 0; i < len; i++) { 
       view[i] = binary.charCodeAt(i); 
       } 

       // create the blob object with content-type "application/csv"    
       var blob = new Blob([view], { type: mimeType }); 
       window.navigator.msSaveOrOpenBlob(blob, "Name your file here"); 
      } 

Answer 4

मुझे एक ही समस्या का सामना करना पड़ा जो क्रोम और फ़ायरफ़ॉक्स के साथ अच्छी तरह से काम करता है, लेकिन सफारी/आईई के साथ नहीं।

निम्नलिखित हैक बाहर की कोशिश की और यह मुझ

के लिए काम किया

var url="http://'+$localStorage.ip+':"+$localStorage.port+'/exportDB'; var form = angular.element("<form action='" + url +"'></form>"); form.submit();

फ़ाइल डाउनलोड ब्राउज़र से ही नियंत्रित किया जाएगा। हालांकि निम्नलिखित इसे करने के लिए सीमा है -

1. आप इस के लिए :(फोन मिल जावास्क्रिप्ट की कोशिश कैच ब्लॉक उपयोग करने की कोशिश त्रुटियों (यदि हो तो) अपने http से संभाल करने में सक्षम नहीं होगा, लेकिन नहीं किया अच्छी तरह से काम ...
2. ..you अभ्यस्त कोड का :(:(इस टुकड़े

एक और दृष्टिकोण है कि काम किया है इकाई परीक्षण करने में सक्षम हो सकता है और यह था -

var url="http://'+$localStorage.ip+':"+$localStorage.port+'/exportDB'; $window.location.href = url;

सुझाव और चर्चाएं आपका स्वागत है!