CODEWITHSUNDEEP
javascriptjsonangularjs
Alex Man
Alex Man

Reputation: 4886

Download fails for large json string -Angular JS

I've written an application in angular for file download, the application is working fine only for small json string, but comes to large string the download fails. Can anyone please tell me some solution for this.

I'm using REST webservice

 var json = _.getJson(); // here json value object be received from a script function 
 var myURL = 'rest/myMethod?jsonValue=' + JSON.stringify(json);
  _.downloadFile(myURL);

The downloadFile method :

downloadFile: function(URL)
{
    $.fileDownload(URL).done(function(e, response)
    {
      console.log('download success');
    }).fail(function(e, response)
    {
      console.log('fail');
    });
}

Upvotes: 1

Views: 1667

Answers (3)

superxp1412
superxp1412

Reputation: 21

Here is an example for using $http of Angular for sending a post request and download a XML file from the server.

$http({
            url: '$your_URL_here$', // you should replace $your_URL_here$ by your own url
            method: 'POST',
            responseType: 'arraybuffer',
            data: postJson, //***this is the request json data for post***
            headers: {
                'Content-type': 'application/json',
                'Accept': 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
            }
        }).success(function(data){
                var blob = new Blob([data], {
                    type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
                });                
                saveAs(blob, $fileName$);// you should replace $fileName$ by your own fileName
            }
        }).error(function(data){
            //Some error handling method here
        });

Please note that you should import the FileSaver.js to save the file from 'arraybuffer' responseType.

Upvotes: 0

Jorg
Jorg

Reputation: 7250

As per the comments, here's how to POST using Angular. I can only give you an example here. Header might depend on the angular version etc etc.

function TestController($scope, $http) {
    $http({
        url: 'yourwebsite',
        method: "POST",
        data: json, //this is your json data string
        headers: {
           'Content-type': 'application/json'
        }
    }).success(function (data, status, headers, config) {
        //upload succesfull. maybe update scope with a message?
    }).error(function (data, status, headers, config) {
        //upload failed
    });

}

Upvotes: 1

Stepan Riha
Stepan Riha

Reputation: 1724

I see two potential problems:

  1. The request URL might be too long (see: this discussion)
  2. The stringified JSON contains characters not valid in a URL

If the URL is too long, you'd have to move the jsonValue into the body of your request rather than passing it as a URL parameter.

To address the second problem, you need to URI encode the stringified value:

var myURL = 'rest/myMethod?jsonValue=' + encodeURIComponent( JSON.stringify(json) );

BTW, looking at tha fail parameters should indicate why the request failed in the first place.

Upvotes: 1

Related Questions