AngularJS - Ricevi e scarica CSV

Question

Sto usando un programma nodeJS come server e un'applicazione web AngularJS come client.

Per creare il CSV sto usando la libreria "express-csv" (https://www.npmjs.com/package/express-csv)

Ecco il mio codice lato server:

Definisce:

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

codice Get:

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

Ecco il mio lato client code:

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

Inutile dire che raggiunge il server e tutto il resto funziona bene, ma non riuscivo a trovare un modo per scaricare il CSV. Aiuto per favore.

P.S

Si prega di non dire che è un duplicato di Prompt a csv file to download as pop up using node.js and node-csv-parser (node module) dal lato client non è realmente menzionato lì. Inoltre, altre domande sono focalizzate sul lato server anziché sul client. Non vi sono altre domande relative al client AngularJS.

Answer 1

Si può solo navigare:

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

Answer 2

È possibile creare un tag e fare clic su di esso:

$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

ci sono modi di scaricare csv. Primo approccio è quello di creare un tag e fare clic

Aggiungi i mimeType nei dati codice qui sotto: application/octet-stream

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(); 

Ma questa soluzione non funziona su IE> 9 e Safari> 6

perché Safari non segue l'attributo di download per tag di ancoraggio

così per safari è possibile utilizzare filesaver.js

e IE questo solut ione lavorerà

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

Ho affrontato lo stesso problema che le soluzioni di cui sopra con le opere bene con Chrome e Firefox, ma non con Safari/IE.

provato un trucco e ha funzionato per me-

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

file scaricare sarà gestito da browser stesso. se segue è la limitazione ad esso -

1. Non sarà in grado di gestire gli errori (se presenti) dal vostro http ottenere chiamare :(Per questo provato con blocco try-catch di javascript, ma non lo fece funzionano bene ...
2. ..si non sarà in grado di unit test questo pezzo di codice :(:(

C'è un altro approccio che ha funzionato ed è stato -

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

Suggerimenti e discussioni benvenuto!