wake-up-neo.net

Wie bekomme ich eine Datei () oder einen Blob () von einer URL in Javascript?

Ich versuche, ein Bild von einer URL (mit ref().put(file)) (www.example.com/img.jpg) in den Firebase-Speicher hochzuladen. 

Dazu brauche ich eine Datei oder einen Blob, aber wenn ich new File(url) versuche, heißt es "nicht genug Argumente"…

EDIT: Und ich möchte eigentlich ein ganzes Verzeichnis von Dateien hochladen, deshalb kann ich sie nicht über die Konsole hochladen

javascriptfileurlblobfirebase-storage
9
Sam

Versuchen Sie es mit der fetch-API . Sie können es wie folgt verwenden:

fetch('https://upload.wikimedia.org/wikipedia/commons/7/77/Delete_key1.jpg')
  .then(res => res.blob()) // Gets the response and returns it as a blob
  .then(blob => {
    // Here's where you get access to the blob
    // And you can use it for whatever you want
    // Like calling ref().put(blob)

    // Here, I use it to make an image appear on the page
    let objectURL = URL.createObjectURL(blob);
    let myImage = new Image();
    myImage.src = objectURL;
    document.getElementById('myImg').appendChild(myImage)
});
<div id="myImg"></div>

Ab April 2018 hat die Abruf-API weltweit etwa 88% Browser-Unterstützung , wobei im Wesentlichen nur IE fehlt. Sie können dies mit einem polyfill auf nahezu 100% bringen, was ich empfehle, wenn Sie noch auf IE abzielen.

20
James Kraus

Die Antwort von @James ist korrekt, jedoch nicht mit allen Browsern kompatibel. Du kannst es versuchen

$.get('blob:yourbloburl').then(function(data) {
  var blob = new Blob([data], { type: 'audio/wav' });
});

1
Ruan Carlos

Es hat nicht funktioniert, bis ich Anmeldeinformationen hinzugefügt habe

fetch(url, {
      headers: {
        "Content-Type": "application/octet-stream",
      },
      credentials: 'include'
 })
0
Stanimir Petrov