Как вызвать диалоговое окно «Сохранить как» в Inte rnet Explorer из контроллера angularjs - PullRequest
1 голос
/ 07 апреля 2020

У меня есть контроллер angularjs, который извлекает URL из конечной точки отдыха. Ответ содержит URL-адрес текстового файла на S3 и заполняет атрибут sr c скрытого iframe содержимым этого файла.

Шаблон

<div>
    <button ng-click="myCtrl.getUrl()" class="btn btn-default"></button>
    <iframe ng-hide="true" ng-src="{{myCtrl.s3Link}}"></iframe>
</div>

Контроллер

angular
  .module('app')
  .component('myComponent', {
    templateUrl: 'template.html',
    controller: MyController,
    controllerAs: 'myCtrl'
  });

function MyController($http, $sce) {
  var vm = this;
  var savedState = browserBackService.retrieveState('resultsPage');
  vm.getUrl = getUrl;
  vm.s3Link = '';

  function getUrl() {
    vm.extractDownloadLink = '';
    $http.get('/api/getS3url').then(extractSuccessCallback);
  }

  function extractSuccessCallback(response) {
    vm.extractDownloadLink = $sce.trustAsResourceUrl(response.data.url);
  }
}

Ответ ответа

{
  "url":"https://myaws.aws.net/s3_bucket/1/2/myFile.txt"
}

Файл существует, и путь указан правильно. В Chrome и Firefox это вызывает диалоговое окно «Сохранить как», которое является правильным поведением, но в Inte rnet Explorer 10 и Edge ничего не происходит.

Какие изменения необходимы для успешного завершения в IE?

Ответы [ 2 ]

1 голос
/ 07 апреля 2020

Рассмотрите возможность использования библиотеки, которая обрабатывает многие браузеры, такие как angular-file-saver

Angular File Saver

0 голосов
/ 08 апреля 2020

Невозможно воспроизвести проблему, используя ваш код, возможно, вы используете метод URL.createObjectURL () или свойство загрузки тега для загрузки файла или что-то подобное. И они не поддерживают браузер IE.

По моему мнению, вы можете попробовать изменить API и добавить метод для получения данных файлового блоба. Затем в браузере IE и Edge после получения данных файла вы можете использовать метод msSaveOrOpenBlob для загрузки файла в браузер IE и Edge, а в браузере Chrome или Firefox вы можете создать гиперссылка для загрузки файла с использованием URL. Более подробную информацию, пожалуйста, проверьте этот образец :

        function btnAttachFileDownload() {

            let fileUpload = $('input#fileUpload');
            let fileName = fileUpload[0].files[0].name;
            let fileSize = fileUpload[0].files[0].size;

            var reader = new FileReader();
            reader.readAsDataURL(fileUpload[0].files[0]);
            reader.onload = function () {
                var blob = b64toBlob(reader.result);
                if (window.navigator.msSaveOrOpenBlob) {
                    console.log('IE 11');
                    // IE 11 the legacy version of Microsoft Edge
                    window.navigator.msSaveOrOpenBlob(blob, fileName);
                } else {
                    console.log('Google chome, Firefox, ....');
                    // Google chome, Firefox, ....
                    var url = (window.URL || window.webkitURL).createObjectURL(blob);
                    $('#filedownload').attr('download', fileName);
                    $('#filedownload').attr('href', url);
                    $('#filedownload')[0].click();
                }
            };
            reader.onerror = function (error) {
                console.log('Error: ' + error);
            };
        };
...