wake-up-neo.net

Dateiname der heruntergeladenen Datei in Daten: Anwendung/Oktettstrom;

Ich versuche, eine Datei mit Datenuri auf folgende Weise herunterzuladen: 

<input type="button"
  onclick="window.location.href='data:Application/octet-stream;content-disposition:attachment;filename=file.txt,${details}'"
  value="Download"/>

Das Problem ist, dass die heruntergeladene Datei immer den Namen "Unknown" trägt, was auch immer ich als Dateiname verwenden möchte. Ist dies der richtige Weg, um der Datei einen Namen zu geben? oder etwas anderes muss getan werden

htmldata-uri
20
parbi

Hier ist die Lösung, Sie müssen dem Anchor-Tag download nur ein a-Attribut mit dem gewünschten Namen hinzufügen

<a href="data:application/csv;charset=utf-8,Col1%2CCol2%2CCol3%0AVal1%2CVal2%2CVal3%0AVal11%2CVal22%2CVal33%0AVal111%2CVal222%2CVal333"
  download="somedata.csv">Example</a>

Eine andere Lösung ist die Verwendung von JQuery/Javascript

Anchor-Download-Eigenschaft

34
Ashraf Bashir

In Safari können Sie dies verwenden und den Benutzer anweisen, die Datei mit ⌘-S zu versehen:

window.open('data:text/csv;base64,' + encodeURI($window.btoa(content)));

Andernfalls wird Filesaver.js verwendet, dies funktioniert jedoch in Ordnung:

    var downloadFile = function downloadFile(content, filename) {
      var supportsDownloadAttribute = 'download' in document.createElement('a');

      if(supportsDownloadAttribute) {
        var link = angular.element('<a/>');
        link.attr({
          href: 'data:attachment/csv;base64,' + encodeURI($window.btoa(content)),
          target: '_blank',
          download: filename
        })[0].click();
        $timeout(function() {
          link.remove();
        }, 50);
      } else if(typeof safari !== 'undefined') {
        window.open('data:attachment/csv;charset=utf-8,' + encodeURI(content));
      } else {
        var blob = new Blob([content], {type: "text/plain;charset=utf-8"});
        saveAs(blob, filename);
      }
    }

Hinweis: Der obige Code enthält einige AngularJS, die sich jedoch leicht ausrechnen lassen sollten ...

3
malix

Für diejenigen, die andere Bibliotheken wie Anglejs oder Backbone verwenden, können Sie so etwas versuchen.

$ ('a.download'). attr ('href', 'data: application/csv; Zeichensatz = utf-8,' + $ scope.data);

1
Rick

Ich hatte das gleiche Problem und löste schließlich in allen Browsern die CSV-Datei auf der Serverseite

const result = json2csv({ data });

res.writeHead(200
        'Content-Type': 'application/octet-stream',
        'Content-Disposition': 'attachment;filename=issues.csv',
        'Content-Length': result.length
});

res.end(result);
0
Aral Roca

Für alle, die nur mit Javascript eine clientseitige Lösung suchen, ist hier meine und arbeitet mit jedem Bruder außer IE 10 und niedriger (und Edge ... warum?!):

var uri = 'data:application/csv;charset=UTF-8,' + encodeURIComponent(csv);
var link = document.createElement('a');
link.setAttribute("download", "extract.csv");
link.setAttribute("href", uri);
document.body.appendChild(link);
link.click();
body.removeChild(body.lastChild);
0
Synedh