Skip to content Skip to sidebar Skip to footer

Display Pdf Stream Returned From Controller Using Jquery In New Window

I have a controller action which reads a .pdf file from azure blobstorage and returns stream object to the $.ajax() method. Controller returns var stream = blobStorage.OpenRead(fil

Solution 1:

I couldnt find a exact answer to this question. I found a bunch of different questions. I finally was able to piece together by using fetch. You need to accept type 'arraybuffer', then you turn into a blob with resopnse.blob(). Then you can open the blob in a new window.

fetch('/post/url', {
                        method:'POST',
                        headers: {
                            Accept:'arraybuffer',
                            'Content-Type':'application/json',
                        },
                        //youneedtousejsonherebody:JSON.stringify({ items: [{ ItemId:3, Quantity:40 }], fileId:2 });
                    }).then(response=>response.blob()).then(data=> {
                            varpopup=window.open(URL.createObjectURL(data), "height=500,width=750);

                   });

Solution 2:

Why don't you just use standard HTML? There's no need for Javascript here (as you created a standard <a> tag for initial trigger of action).

Something like:

<formaction="/PDFfile"method="post"target="_blank"><inputtype="submit"value="Show me the file in a new tab/window!"/></form>

Notes:

  • be sure to set an header Content-Type: application/pdf in your Azure script, so that the browser will know it's a PDF
  • as @JamesBlond stated you may not see it if you don't have a browser's plugin to read PDF. But you'll have a nice download box, and the new tab will be closed automatically

Post a Comment for "Display Pdf Stream Returned From Controller Using Jquery In New Window"