PDF renders as empty white box

Question

I have a project named "Project", and a PDF file caled "file.pdf" located in Project/app/assets/file.pdf. I want to render the PDF on a page called "file.html", located in Project/app/views/static/file.html.

I wrote the following code, but all that displays is an empty white box.

<embed src="../../assets/file.pdf" width="500" height="375" type='application/pdf'>

I'm pretty sure my browser can't find the file. What could I be doing wrong?

UPDATE: I also tried it with an image, placed in app/assets/images/Image.png, like so:

<embed src="../../assets/images/Image.png" width="500" height="375" type='image/png'>

but that doesn't render either.

UPDATE 2: Output from console:

Started GET "/file" for 127.0.0.1 at 2016-02-21 04:48:27 -0600 Processing by StaticController#file as HTML

Rendered static/file.html.erb within layouts/application (63.8ms) Completed 200 OK in 757ms (Views: 749.4ms | ActiveRecord: 0.0ms)

Started GET "/assets/application.self-e570ac372b74f676a029186250aeeba9bf7016bcd014314d103b5d18b3eb858e.css?body=1" for 127.0.0.1 at 2016-02-21 04:48:28 -0600

Started GET "/assets/pdf-8f705790d319666d8f804cf8809f4d74f036483049ef8c520646d6c98ebedc5f.png" for 127.0.0.1 at 2016-02-21 04:48:28 -0600

Started GET "/assets/Advanced_Reading_Sample.pdf" for 127.0.0.1 at 2016-02-21 04:48:28 -0600

What browser are you using? I have the exact setup and using chrome I am able to render the pdf doc. — Norman Bentley, Feb 17 '16 at 20:17
@NormanBentley I'm using the latest version of Chrome on Ubuntu. — Joe Morano, Feb 17 '16 at 20:37
strange, I am on windows and dont have an Ubuntu VM available. How about if you put them in the same folder and update the src? to just src="file.pdf" — Norman Bentley, Feb 17 '16 at 20:56
Your code looks correct, try embedding another pdf, or an image. — Norman Bentley, Feb 17 '16 at 21:07
Rendering an image with "application/pdf" doesn't seem like a good idea... — David van Driessche, Feb 21 '16 at 09:07
You're giving the browser an image and telling it it's a PDF file. — David van Driessche, Feb 21 '16 at 09:11
The media type for PNG files is "image/png". If you specifically tell the browser you're giving it a PDF file, and then you put a PNG file there, that isn't going to help you figure out a situation that already isn't working in the first place, is it? — David van Driessche, Feb 21 '16 at 09:14
@DavidvanDriessche Oh of course. I changed it but it still won't render. — Joe Morano, Feb 21 '16 at 09:18
http://stackoverflow.com/questions/14081128/how-can-i-embed-a-pdf-viewer-in-a-web-page http://stackoverflow.com/questions/1244788/embed-vs-object — Mysterfxit, Feb 22 '16 at 19:00
Are you running your app in production mode? Because in production mode rails deactivates serving of static assets (from `app/assets`); or, if you're not running that way, maybe that setting is disabled: check for `config.serve_static_files` [here](http://guides.rubyonrails.org/configuring.html). — Fer García, Feb 22 '16 at 22:25

score 4 · Answer 1 · answered Feb 25 '16 at 09:31

In your controller write,

def file
  pdf_filename = File.join(Rails.root, "/assets/file.pdf")
  send_file(pdf_filename, :filename => pdf_filename, :disposition => 'inline', :type => "application/pdf")
end

Rename your file.html => file.html.erb and place it under views/controller_name/file.html.erb, also add route to this controller action.

In above setup when you access controller/file/ pdf will shown in the browser(inline).

score 2 · Answer 2 · answered Feb 21 '16 at 11:41

2

Try this and see if it works

<iframe src="yourfile.pdf" style="width:100%; height:700px;" frameborder="0"></iframe>

answered Feb 21 '16 at 11:41

Omari Victor Omosa

2,814
2
24
46

I'm getting a screen that tells me there are no route matches for that path. – Joe Morano Feb 21 '16 at 20:10
do you see this part `src="yourfile.pdf"` have you tried to link that part to where your pdf is? e.g. `src="../../assets/file.pdf"` .Try linking that to your file . And if your file is a pdf it has to display. – Omari Victor Omosa Feb 21 '16 at 21:39
I tried that as well, but it's still telling me it can't find the route. – Joe Morano Feb 21 '16 at 21:44
@JoeMorano check your file it must be pdf or you path might be incorrect, i.e. `src="../../assets/file.pdf"` that path might not be pointing to that file or file might be corrupt leading to white screen. If it doesnt work we can try another way – Omari Victor Omosa Feb 21 '16 at 21:47
@JoeMorano What if you copy the pdf to the same folder where the `file.html` file is the try this direct path `src="file.pdf" ` just try. here where i am it is working . – Omari Victor Omosa Feb 21 '16 at 21:50
They're in the exact same folder and and I wrote src="file.pdf", but I'm getting the error 'No route matches [GET] "/file.pdf"' – Joe Morano Feb 21 '16 at 22:05
@JoeMorano try the same with another file e.g. `src="anotherfile.pdf"` to test if the file is corrupt. and if you have php codes in that page then save the page as `file.php` insted as `file.html` – Omari Victor Omosa Feb 21 '16 at 22:20

FixerRB · Answer 3 · 2016-02-21T10:26:33.910

1

Create folder called pdf (for example) in app/assets and put there your file.pdf then in app/views/static/file.html change src of embed tag to /assets/file.pdf. This should do the trick.

edited Feb 21 '16 at 10:26

answered Feb 21 '16 at 10:11

FixerRB

326
2
11

I tried that, but it just shows the same empty white box. – Joe Morano Feb 21 '16 at 10:21
@JoeMorano oops, there should be `/assets/file.pdf` in `src` instead of `/assets/pdf/file.pdf`. – FixerRB Feb 21 '16 at 10:28
Yeah I'm still getting the the same result. – Joe Morano Feb 21 '16 at 10:30
@JoeMorano have you tried to restart rails server? If it doesn't help can you post here your console log? – FixerRB Feb 21 '16 at 10:38
Yes, I restarted the server. What console log should I post? – Joe Morano Feb 21 '16 at 10:40
@JoeMorano that one which appears in console when you run `rails server`. Try to reload your page where pdf should appear and then post the log here. – FixerRB Feb 21 '16 at 10:45
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/104087/discussion-between-fixerrb-and-joe-morano). – FixerRB Feb 21 '16 at 10:46

score 1 · Answer 4 · answered Feb 23 '16 at 10:40

1

Try, This will help

<a href="../../assets/file.pdf" target="_blank">Click To View</a>

thanks

Mark SykOv

answered Feb 23 '16 at 10:40

Ahsan Aziz Abbasi

168
13

score 0 · Accepted Answer · answered Feb 28 '16 at 21:22

Well I have no idea why my app can't find the file. I just ended up using iframes and the absolute url of the file:

<iframe src="http://www.project.com/file.pdf" style="width:100%;height:100%;"><p>Your browser does not support iframes.</p></iframe>

And finally, the file renders.

PDF renders as empty white box

5 Answers5