Создание загружаемого файла с помощью dataURL - PullRequest
0 голосов
/ 23 ноября 2018

Я пытаюсь создать загружаемый файл только из dataURL, и я не уверен, почему он не работает.Я читаю dataURL из файла и вставляю его dataURL в атрибут с загрузкой.но когда я генерирую de click, страница становится пустой и говорит, что не может найти страницу.Вот как я пытаюсь это сделать.

reader.readAsDataURL(file);
reader.onload = function (evt) {
    var element = document.createElement('a');
    element.setAttribute('href', evt.target.result);
    var name=filename.split(".");
    element.setAttribute('download', 'filename');

    element.style.display = 'inline-block';
    document.body.appendChild(element);

    element.click();

    document.body.removeChild(element);
 }

Из приведенного выше кода я получаю это

enter image description here

Как я могуправильно сделать действие загрузки для dataURL?

1 Ответ

0 голосов
/ 23 ноября 2018

Ваш подход неверен.

Метод readAsDataURL используется для чтения содержимого указанного BLOB-объекта или файла.Результатом будет строка в кодировке base64.

Метод readAsDataUrl можно использовать для предварительного просмотра изображения.

Для загрузки файла вы можете использовать этот подход

<!DOCTYPE html>
<html>
  <head> </head>
  <body>
     <form>
        <label for="file">ChooseFile</label>
        <input type="file" id="myFile" accept="image/*">
    </form>

    <script>
        document.getElementById("myFile").addEventListener("change", downloadFile);

        function downloadFile() {            
            let file = this.files[0];
            let url = URL.createObjectURL(file);

            let link = document.createElement('a');
            link.href = url;
            link.download = file.name;
            link.click();
            link = null;

            URL.revokeObjectURL(url);
        }
    </script>
  </body>
</html>

Полезноресурсы

...