1

I have Rest API that sends the csv String like

"aa,bb\n cc,dd"

Here is the Rest Service code:

@GET
    @Path("/getCsv")
    @Produces({"text/csv"})
    public String getCSV(   ) {
        return "aa,ba,\n,ac,da";    
    }

On UI side

Angular resource code to make get request code is as below:

angular.module('csvHelper', ['ngResource','configuration']).factory('csvHelper', function($resource,$rootScope){
            return $resource(URL+'/api/getCsv/', {}, { 
                query: {method:'GET', params:{}, cache :true}
            });
            });

Code that makes get request and generate csv is as follows

csvHelper.query({}, function(response) {
                 def.resolve(response);  
                 },function(response) {
                 def.reject(response);  
                 });

           var prom = def.promise;
            prom.then(function(text) {              
                $window.open("data:text/csv;charset=utf-8," + encodeURIComponent(text));            
            }, function(error) {
                    console.log('promise failed', error);
            });

In network tab I see rest API sending the data properly:

   "aa,ba,\n,ac,da"

But when I download the csv file, inside it I see

[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

What am I doing wrong.

EDIT

I tired to print response on console and this is what I saw:

[e { 0="a",  $get=function(),  $save=function(),  more...}, e { 0="a",  $get=function(),  $save=function(),  more...}, e { 0=",",  $get=function(),  $save=function(),  more...}, e { 0="b",  $get=function(),  $save=function(),  more...}, e { 0="a",  $get=function(),  $save=function(),  more...}, e { 0=",",  $get=function(),  $save=function(),  more...}, e { 0="\n",  $get=function(),  $save=function(),  more...}, e { 0=",",  $get=function(),  $save=function(),  more...}, e { 0="a",  $get=function(),  $save=function(),  more...}, e { 0="c",  $get=function(),  $save=function(),  more...}, e { 0=",",  $get=function(),  $save=function(),  more...}, e { 0="d",  $get=function(),  $save=function(),  more...}, e { 0="a",  $get=function(),  $save=function(),  more...}]

EDIT 2

I changed the logic to use $http like this:

$http.get("http://myurl.com/api/getcsv")
              .success(function (response) {console.log(success)});

I see the success printed on console but I don't see popup.

when I hit http://myurl.com/api/getcsv in browser I see popup to download file.

What am I missing

EDIT 3

This change worked.

 $http.get(compiledUrl).then(function (response) {               
                          $window.open("data:text/csv;charset=utf-8," + encodeURIComponent(response.data));                             
                  },function(response){
                      console.log("error");                  
                  });   
6
  • Seems like you need JSON.stringify(text). You should also use encodeURI() instead of encodeURIComponent()
    – Todd
    Aug 4, 2015 at 22:19
  • yeah, try encodeURI instead. it seems that JSON.stringify wouldn't be needed because you're returning text.
    – Todd
    Aug 4, 2015 at 22:22
  • 1
    It is not Json Data . How can I use JSON.stringify?
    – javaMan
    Aug 4, 2015 at 22:40
  • refer to second comment
    – Todd
    Aug 4, 2015 at 22:43
  • 1
    so, for some reason, you're not returning a plain string. try changing the produces annotation such that it returns @Produces({"text/plain"}). the goal is to get your response to be a string.
    – Todd
    Aug 4, 2015 at 22:48

2 Answers 2

4

If you just want to download the CSV string, you should use $http and not $resource.

$resource returns: A resource "class" object with methods for the default set of resource actions optionally extended with custom actions.

$resource @ angularjs.org

3
  • $http returns promise... So again it will be same logic right
    – javaMan
    Aug 4, 2015 at 22:40
  • Please edit the code in your original question with the most updated code so I can take a look... or put it in a plunkr.
    – Itamar L.
    Aug 5, 2015 at 17:10
  • It worked . Thanks. I changed the code as showed in edit 3
    – javaMan
    Aug 6, 2015 at 15:35
0

you can use two custom function

1

function JSONToCSVConvertor(JSONData,ShowLabel) {    
  var arrData = typeof JSONData != 'object' ? JSON.parse(JSONData) : 
SONData;   
 var CSV = '';       
if (ShowLabel) {     
var row = "";
 for (var index in arrData[0]) {
     row += index + ',';
 }
 row = row.slice(0, -1);
 CSV += row + '\r\n';
  }
  for (var i = 0; i < arrData.length; i++) {
 var row = "";
 for (var index in arrData[i]) {
    var arrValue = arrData[i][index] == null ? "" : '="' + arrData[i][index] + '"';
    row += arrValue + ',';
 }
 row.slice(0, row.length - 1);
 CSV += row + '\r\n';
  }
  if (CSV == '') {        
 growl.error("Invalid data");
 return;
  }   
  var fileName = "Result";
  if(msieversion()){
  var IEwindow = window.open();
  IEwindow.document.write('sep=,\r\n' + CSV);
  IEwindow.document.close();
  IEwindow.document.execCommand('SaveAs', true, fileName + ".csv");
  IEwindow.close();
  } else {
   var uri = 'data:application/csv;charset=utf-8,' + escape(CSV);
   var link = document.createElement("a");  
   link.href = uri;
   link.style = "visibility:hidden";
   link.download = fileName + ".csv";
   document.body.appendChild(link);
  link.click();
   document.body.removeChild(link);
 }
}

2

function msieversion() {
  var ua = window.navigator.userAgent; 
  var msie = ua.indexOf("MSIE "); 
  if (msie != -1 || !!navigator.userAgent.match(/Trident.*rv\:11\./)) // If Internet Explorer, return version number 
  {
return true;
  } else { // If another browser, 
   return false;
  }    
return false; 
}

and use above function to have downloadable result.csv file

  if(data.userlog == '')
            return;
        JSONToCSVConvertor(data.userlog, true);

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.