Cannot read the pdf content in the browser with ember

Question

Objective: Display a pdf file, received as a response from server in the new window using ember.

Code in the route file:

actions: {
    pdfClick(assessmentId) {
      var result = [];
      return new Ember.RSVP.Promise(function (resolve, reject) {
        Ember.$.ajax({
          type: 'GET',
          url: 'http://localhost:4200/abc/secured/rest/questions/166',
          success: function (data) {
            var winlogicalname = "detailPDF";
            var winparams = 'dependent=yes,locationbar=no,scrollbars=yes,menubar=yes,' +
              'resizable,screenX=50,screenY=50,width=850,height=1050';

            var detailWindow = window.open("content-type:application/pdf");
            detailWindow.document.write(data);
          },
          error: function (request, textStatus, error) {
            console.log(error);
          }
        });
      });
    }
  }

Confusion:

var detailWindow = window.open("content-type:application/pdf");
detailWindow.document.write(data);

In the window.open, we are setting the content type as application/pdf and then when we try to write the data (bytestream of PDF file received as a response from the server), junk data appears in the new window.

If I hit the service by Chrome browser, Chrome is able to display the pdf but if I hit the same service with ember ajax, I am not able to display the pdf in the new window.

score 0 · Accepted Answer · edited May 23 '17 at 12:25

The problem is about jQuery. jQuery doesn't handle binary data (Reference). While your server is sending binary, you cannot handle this request.

You have different options:

Transporting the binary data by using base64 encryption: Actually I don't like it because of its' overhead.
Using pure XMLHttpRequest instead of jQuery: I've used this in my current project, it works! But too much line of code, hard to track and maintain. Need to wrap with Ember.Promise. My implementation is very close to these answers:1, 2.
Using jQuery transporters: I saw it but haven't use it yet. I don't know whether it is working or not. Here is the reference if you want to look it.

Cannot read the pdf content in the browser with ember

1 Answers1