angularjs + FileAPI + download

ZeZeN
Javascript

Bonjour,

J'ai un probleme de téléchargement de fichiers.

Un fichier doit être créé et proposé au téléchargement à l'utilisateur en direct après une requete au serveur embarqué sur une carte externe, j'ai essayé plein de méthodes mais aucune ne fonctione comme prévu.

J'ai d'abord essayé comme ça : 

<a ng-href="{{aboutLinks.logs}}" download="logs.crp"  title="Download crypted logs">Download Logs</a>

Le problème est que ce que renvoie l'url contenue dans $scope.aboutLinks.logs est sous cette forme : http://[ipDuServeur]/xmlrpc.fcgi?service=tigrootail

On me propose donc bien de télécharger le fichier mais le nom spécifié dans l'atttribu download n'est pas respecté.

J'ai ensuite pensé à la file API, j'ai donc créé un service appelé dans mon controller via une fonction actionnée par ng-click sur mon lien.

LE LIEN : 

<a download="logs.crp" ng-click="downloadFile(aboutLinks.logs, 'logs.crp')" title="Download crypted logs">Download Logs</i></a>

La fonction utile dans mon service :

dlFile: function(url, filename){
            return $http.get(url).then(function(res){

                // Blob creation
                try {
                    var blob = new Blob([res.data], {type:'text/plain'});
                }
                catch(e) {
                    // TypeError old chrome and FF
                    window.BlobBuilder = window.BlobBuilder || 
                                         window.WebKitBlobBuilder || 
                                         window.MozBlobBuilder || 
                                         window.MSBlobBuilder;
                    if(e.name == 'TypeError' && window.BlobBuilder){
                        var bb = new BlobBuilder();
                        var buffer = new ArrayBuffer(res.data.length)
                        bb.append(buffer);
                        var blob = bb.getBlob('text/plain');
                    }
                    else if(e.name == "InvalidStateError"){
                        // InvalidStateError (tested on FF13 WinXP)
                        var buffer = new ArrayBuffer(res.data.length)
                        var blob = new Blob( [buffer], {type:'text/plain'});
                    }
                    else{
                        // We're screwed, blob constructor unsupported entirely   
                        alert("This feature is not supported on your browser.");
                    }
                }
                if(blob){
                    // fake link creation
                    var downloadLink = document.createElement("a");
                    downloadLink.download = filename;
                    downloadLink.innerHTML = "Download File";
                    if (window.webkitURL != null)
                    {
                        // Chrome allows the link to be clicked
                        // without actually adding it to the DOM.
                        downloadLink.href = window.webkitURL.createObjectURL(blob);
                    }
                    else
                    {
                        // Firefox requires the link to be added to the DOM
                        // before it can be clicked.
                        downloadLink.href = window.URL.createObjectURL(blob);
                        downloadLink.style.display = "none";
                        document.body.appendChild(downloadLink);
                    }

                    downloadLink.click();
                    downloadLink.remove();
                }
            })
        }

ça fonctionne parfaitement sous FF et Chrome, il y a une erreur de droits sous IE et ça ne fonctionne pas du tout sous android browser.

J'ai d'ailleurs appri que la File api n'allait pas être gardée pour les prochaines versions de navigateurs.

Y a t-il un moyen simple de proposer d'enregistrer un fichier à l'utilisateur depuis les données d'une requete ajax ???

Ais-je fait une erreur quand à l'attribu 'download' pour html5 ?

Merci aux gentils qui voudront bien lire tout ça et surtout me proposer leur aide ...

Aucune réponse