No file download after AJAX Post in Ember

Question

I have an AJAX Post request located in one of my ember controllers to a Node.js server :

$.ajax({
          type: "POST",
          url: "https://localhost/api/report",
          contentType: "application/json",
          data: payload,
          headers: {"Accept":"text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8",
                    "Cache-Control": "no-cache",
                    "Pragma": "no-cache"
                    }
        });

The Post request is successful and returns with the response headers:

Access-Control-Allow-Origin:*
Connection:keep-alive
Content-Disposition:attachment; filename="report.pdf"
Content-Type:application/pdf
Date:Wed, 15 Jul 2015 19:11:23 GMT
File-Extension:pdf
Number-Of-Pages:1
Transfer-Encoding:chunked
Vary:Origin
X-Powered-By:Express
X-XSS-Protection:0

This response should initiate a file download within the browser, but nothing happens. I have tested the same request to the same location from outside of my Ember application and it successfully initiates the download.

What is the issue with my request/response? Am I going about this the wrong way for Ember?

Answer 1

It's not an issue with Ember, it's an issue with javascript. You can't make an ajax request that starts a file download like that. You can however create an iframe, a form, post to the iframe and that will in turn trigger the file download.

See:

• Handle file download from ajax post
• Download a file by jQuery.Ajax