Render PDF in visualizer

Hey ya’ll!

Just checking to see if anyone has tried rendering a PDF in Postman’s visualizer, and if so what the working approach was.

What type of HTTP response are you getting here? Does the endpoint return a PDF document and you want it to be rendered in Visualizer?

The endpoint will return a response that includes the PDF as a base64 string. This base64 string should ultimately be rendered in Visualizer as a visible PDF.

Hi @john-paul,

When I saw this, it really intrigued me, so I dove in…

From my current testing, it doesnt seem to be possible give then way I was doing it (refer below)

<object data="data:application/pdf;base64,base64_data_goes_here></object>

  • you can also do <embed> or <iframe>

The problem I found was this:

Refused to frame '' because it violates the following Content Security Policy directive: "frame-src 'none'".

Refused to load plugin data from 'data:application/pdf;base64,base64_data_here' because it violates the following Content Security Policy directive: "object-src 'none'".

So Snooping around the html that Postman preloads, I found this:

<meta http-equiv="Content-Security-Policy" content="default-src 'none'; script-src http: https: 'unsafe-inline'; style-src http: https: 'unsafe-inline' ; img-src http: https: data:; font-src http: https:; connect-src http: https:; media-src http: https:; object-src 'none'; child-src 'none'; frame-src 'none'">

This is what its complaining about. So if I removed a buncha these tags (defaulf-src, object-src, frame-src), I was able to get a pdf to render! In chrome that is…

But, when sending a request, a new html file is made every time in the temp directory, so there is no way I can get around the auto generated html they have.

However, I should say that the HTML they have in there is regarded as best practice, so nothing bad on their end :smile:.

I havent tried javascript libraries (like pdf.js), but I forsee similar issues happening, but I cant confirm that.

I’d say you make this a feature request here #feature-requests.

Hope this helps! (I was secretly hoping I could get this to work)

Orest

3 Likes

How were you able to modify the preload file so that new requests persisted your changes? And where exactly did you find the preload files?

Hi @twhiteside!

Welcome to the community! :clap:

So, sadly, I was not able to modify the preload file in a way that persisted the changes that allowed for the pdf to render. Rather, it was only a one time thing I could do. I can change that .html postman generates, open it in Chrome, and then it would show the pdf. However, When executing the request again, a new .html file is generated, and so any changes I made to try and persist the information did not work.

You can find the preload files by referencing the article here, for debugging visualizer.

You will notice when “Inspecting Visualization” (right click in your visualization when it loads), it just opens Chrome developer tools. Then at the top, of the new window for Developer Tools, you’ll see its referencing a file path to an html. file. Now sure what it is in Windows, but for macOS I found it under /var/folders/ and then some random string folders afterwards.

Update:
I did make a video on visualizing PDFs with Postman. Sadly, its not within Postman, but you can set up the HTML in Postman and then view the PDF in a browser:

In addition, I started an RFC for natively supporting browsers in Postman Visualizer:

https://community.postman.com/t/native-support-for-pdf-files-in-visualizer/17631

Now it just needs some traction :slight_smile:

Hope this helps!

2 Likes