How to take data.name from success http post method in angular?

Question

I read many questions and answers from my problem but I did't found solution. I try to download file and when I get file , that is Object .. how I can take name of that file?

my get method:

this.downloadFile = function(data) {
    return $http({
            method:'get',
            url:this.apiUploadFileUrl+"allFiles/"+data,
            responseType:'arraybuffer'
    });
};

on server side... a make response and Add file

File[] allFiles = projectFolder.listFiles();
                File oneFile = allFiles[id];
                path = oneFile.getAbsolutePath();
          InputStream in = new FileInputStream(new File(path));
          org.apache.commons.io.IOUtils.copy(in,       response.getOutputStream());
          response.flushBuffer();
          in.close();

and here i get file which I wont to download, but how to take name of the file ?

uploadFileRestServices.downloadAllFiles(data)
            .success(function(databack,response,status,data) {
                var file = new Blob([ databack ], {
                    type : 'application/csv'
                });
                var fileURL = URL.createObjectURL(file);
                var a         = document.createElement('a');
                a.href        = fileURL; 
                a.target      = 'filename';
                a.download    = "lll.txt";
                document.body.appendChild(a);
                a.click();              })
            .error(function() {
                alert("error");
    });

I got file but only I don't know how to take name of that object(file) ... OR... Because on server side I know filename , can I somewhere in response put file name(header or....) and how on angular side to take that attribut ???

I use AngularJS, REST, Spring ...

Thanks in advance for any help.

Depends on your usecase. Do you need the original filename or can you just give the file a fake filename? For the first case i would probably have another rest call to get the files metadata from the server. — Michael, May 02 '15 at 16:40
I need original filname, can I somewhere in response http header put string and take in angular that string (filename) ???... if I don't find solution ... I call rest twice time ... — zexco2, May 02 '15 at 17:35

score 1 · Answer 1 · answered May 02 '15 at 22:06

On the server side set the header. The default header name is 'Content-Disposition'.

@RequestMapping("/file")
public HttpEntity<byte[]> getFile() throws IOException {

    byte[] bytes = "random-file-content".getBytes();

    HttpHeaders header = new HttpHeaders();
    header.setContentType(MediaType.APPLICATION_OCTET_STREAM);
    header.set("Content-Disposition", "attachment; filename="
            + "original-file-name.bin");
    header.setContentLength(bytes.length);

    return new HttpEntity<byte[]>(bytes, header);
}

In Angular you can easily read the header like this:

angular.module('app', []).controller(
        'FileController',
        function($scope, $http) {
            $http.get('file').success(
                    function(data, status, headers, config) {
                        $scope.data = data;
                        $scope.filename = headers('Content-Disposition');
                    });
        });

This is good ... I got filename in header, I see that in browser but when I call `$scope.filename = headers('Content-Disposition');` I got this error ..headers is not a function ... ??? — zexco2, May 02 '15 at 22:44

score 0 · Answer 2 · answered May 02 '15 at 18:31

0

You could add a custom HTTP header to the response to carry the filename. Simply set it on the response object on the server side and extract it from the response in the client.

$http.get(...).then(function(response) {
   var filename = response.headers('your-custom-header-name');
});

However, I think I'd rather make another request for the metadata.

answered May 02 '15 at 18:31

lex82

11,173
2
44
69

I try many solution on server side to put header and take on client side but not working ... ... I try this everything ... `response.sendRedirect(oneFile.getName()); response.setHeader("name", oneFile.getName()); response.setDateHeader(oneFile.getName(), 1); response.addHeader("name", oneFile.getName());` , but not working ... Do you have idea which function to use tor setHeader and to getHeader on client ... ? – zexco2 May 02 '15 at 19:14
what about response.addHeader()? You should be able to examine the headers in your browser to see if it is actually set. Reading the headers should be working as in my answer. – lex82 May 02 '15 at 19:31
it should be straigtforward as shown in my answer. Maybe this solves your problem? http://stackoverflow.com/questions/17038436/reading-response-headers-when-using-http-of-angularjs – lex82 May 02 '15 at 20:54

How to take data.name from success http post method in angular?

2 Answers2