Question

我需要在客户端浏览器上成功完成文件下载后获得成功回调。所以我在我的角度代码中使用$ .fileDownload（）jquery库。我将此链接作为参考[Download a file from server using angularjs 1

这是我的代码的index.html

<!DOCTYPE html>
<html ng-app="fileDownload">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <link data-require="bootstrap-css@3.1.1" data-semver="3.2.0" rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" />
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link rel="stylesheet" href="style.css" />
    <script data-require="angular.js@1.2.x" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.17/angular.js" data-semver="1.2.17"></script>
    <script data-require="jquery@*" data-semver="2.1.1" src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.18/angular-cookies.js"></script>
    <script src="app.js"></script>
    <script src="controller.js"></script>
    <script src="service.js"></script>
  </head>
<body ng-controller="DownloadCtrl">
   <button class="btn btn-default" data-ng-click="download()">Download1</button>
</body>
</html>

这是我的控制器

angular.module("fileDownload").controller('DownloadCtrl', ['$scope', '$element', '$attrs', '$timeout', function ($scope, $element, $attrs, $timeout) {

               $scope.progress = 0;

                function prepare(url) {
                    alert("Please wait", "Your download starts in a few seconds.", $scope.progress);
                    fakeProgress();
                }
                function success(url) {
                    alert('download complete');
                }
                function error(response, url) {
                    alert("Couldn't process your download!");
                }

                function fakeProgress() {
                    $timeout(function () {
                        if ($scope.progress < 95) {
                            $scope.progress += (96 - $scope.progress) / 2;
                            console.log('dialogs.wait.progress', { 'progress': $scope.progress });
                            fakeProgress();
                        }
                    }, 250);
                }

                $scope.download = function () {
                    $scope.progress = 0;
                    $.fileDownload("abc[LR].mkv", { prepareCallback: prepare, successCallback: success, failCallback: error });
                }

                $scope.download();

}]);

使用JQuery filedownload js作为https://cdnjs.cloudflare.com/ajax/libs/jquery.fileDownload/1.4.2/jquery.fileDownload.js

这个$ .fileDownload函数不会触发成功下载

 $.fileDownload("abc[LR].mkv", { prepareCallback: prepare, successCallback: success, failCallback: error });
   }

那么，问题是什么？请帮帮我。

Answer 1

查看这个jq插件的开发页面。 http://johnculviner.com/jquery-file-download-plugin-for-ajax-like-feature-rich-file-downloads/

您需要在Response：

设置服务器端Cookie

Set-Cookie: fileDownload=true; path=/

因此插件知道下载何时触发。

希望它有所帮助。

$ .fileDownload（）successCallback不在角度js中工作

1 个答案: