bezahlt von Downloads und File-Saving
Manchmal möchte man einfach eine am Server erzeugte Datei dem Benutzer zum Download anbieten. Dafür könnte man einen einfachen Link erzeugen.
Wenn die Datei aber aber auf einer größeren JSON Datenstruktur basiert, die man erst einmal mit an den Server schicken muss, ist man mit einem Link und GET-Parametern schlecht beraten.
Am liebsten würde man die Daten ganz normal per Angular an den Server senden, dann den Datei-Inhalt erhalten und den am Client für den Benutzer als Download anbieten.
Manchmal hat man auch schon alle Daten schon am Client vorliegen oder kann diese dort einfach erzeugen oder konvertieren.
Hier hilft eine Objct-URL und der Blob-Objekt von JavaScript. Damti erstellt man sich einen Link den man über ein Event auslöst und so den Klick des Benutzers auf den Link simuliert.
var funcSaveFile = function(csvData){
//create link
var url = URL.createObjectURL(new Blob([csvData]));
var a = document.createElement('a');
a.href = url;
a.download = 'file.csv';
a.target = '_blank';
//triger link with an event
var event = document.createEvent("MouseEvents");
event.initMouseEvent("click", true, true, window,
0, 0, 0, 0, 0,
false, false, false, false,
0, null);
a.dispatchEvent(event);
};
Damit lassen sich relativ einfach Daten aus einer AngularJS oder anderen JavaScript Anwendung zum lokalen Download anbieten, was man für Speichern Methoden und so etwas ja doch häufiger braucht.
Wenn die Datei aber aber auf einer größeren JSON Datenstruktur basiert, die man erst einmal mit an den Server schicken muss, ist man mit einem Link und GET-Parametern schlecht beraten.
Am liebsten würde man die Daten ganz normal per Angular an den Server senden, dann den Datei-Inhalt erhalten und den am Client für den Benutzer als Download anbieten.
Manchmal hat man auch schon alle Daten schon am Client vorliegen oder kann diese dort einfach erzeugen oder konvertieren.
Hier hilft eine Objct-URL und der Blob-Objekt von JavaScript. Damti erstellt man sich einen Link den man über ein Event auslöst und so den Klick des Benutzers auf den Link simuliert.
var funcSaveFile = function(csvData){
//create link
var url = URL.createObjectURL(new Blob([csvData]));
var a = document.createElement('a');
a.href = url;
a.download = 'file.csv';
a.target = '_blank';
//triger link with an event
var event = document.createEvent("MouseEvents");
event.initMouseEvent("click", true, true, window,
0, 0, 0, 0, 0,
false, false, false, false,
0, null);
a.dispatchEvent(event);
};
Damit lassen sich relativ einfach Daten aus einer AngularJS oder anderen JavaScript Anwendung zum lokalen Download anbieten, was man für Speichern Methoden und so etwas ja doch häufiger braucht.
| User | annonyme | 2017-05-15 19:11 |
write comment: