Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/383.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript “另存为”blob从给定url下载文件花费的时间太长_Javascript_Angularjs_Download_Blob_Save As - Fatal编程技术网

Javascript “另存为”blob从给定url下载文件花费的时间太长

Javascript “另存为”blob从给定url下载文件花费的时间太长,javascript,angularjs,download,blob,save-as,Javascript,Angularjs,Download,Blob,Save As,我已经编写了以下服务来保存给定URL中的文件 (function() { angular.module('SOME_APP') .service("downloadService", downloadService); function downloadService($http){ var downloadFileFromUrl = downloadFileFromUrl; function down

我已经编写了以下服务来保存给定URL中的文件

(function() {
    angular.module('SOME_APP')
        .service("downloadService", downloadService);

        function downloadService($http){

            var downloadFileFromUrl = downloadFileFromUrl;

            function downloadFileFromUrl(url){

                if(!url.length){
                    //TO-DO handle the error
                }

                else{
                    //find the file name and extension, to save it as:
                    var fileName;
                    for(var i=url.length; i>=0; i--){
                        if(url[i]=='/'){
                            fileName=url.slice(i+1, url.length);
                            console.log(fileName);
                            break;
                        }
                    }
                    $http({
                        url: url,
                        method: "GET",
                        responseType: 'arraybuffer'
                        }).success(function (data) {
                            var blob = new Blob([data], {type: '*/*'});
                            saveAs(blob, fileName);
                        }).error(function (data) {
                            console.log(data);
                            //TO-DO error handling
                    });
                }
            }

            return {
                    downloadFileFromUrl : downloadFileFromUrl
            }
        }
}());

当我调用服务时,服务首先下载文件,下载完成后,它会在浏览器中显示下载(进度为100%)。我如何使它正常工作?(在浏览器中启动下载,并逐步显示进度)

我的目的是从给定的url下载一个文件。我使用HTML5锚定标记和下载属性实现了它,如下所示:

在index.html中:

               <a id='downloadTag' href="" download hidden></a>

这就解决了我的问题。

为什么不设置一个计时器呢?不能同时设置两个计时器。您无法下载本机浏览器并获得进度通知。您需要设置一个常规的XmlHttpRequest并添加一个进度侦听器,或者在
$http
中找到一种操作底层XHR对象的方法来添加侦听器。每次数据到来时都要保存它,这不是最好的下载方式。最好为传入数据注册事件,并知道何时完成事务。如果您希望它像下载一样简单,您可以提供一个指向标记html的链接,并为其提供下载属性。只需为您下载
                document.getElementById("downloadTag").href=url;
                document.getElementById("downloadTag").click();