CKTEST pdf views

I did some research and there are a few options for us. Take a look and think about it. Remember that people can simply do a screen capture to copy/print the PDFs f they want. Alternatively, what I do is right-click “View page source” and find the URL to the PDF/JPG. I then enter that address directly into the browser and download the PDF/JPG. There isn’t much you can do to stop that. The best I’ve seen is for us to put all the PDFs/JPGs into a special directory and add a .htaccess file so if someone tries to directly browse to the JPG/PDF, they get a 403 Forbidden error. We get access to them by using a special servedata.php/?file=xxx script which has back-door access to that special directory.

I don’t know what your pain point is. I don’t know how secure you want to try to be. Unfortunately all the PDF methods fail with a simple Ctrl-P to print the web page and thus the currently viewed section of the PDF. Only method 4, using JPGs, gets around that, but it is complicated and time consuming. Maybe too painful for people (John, …) to use? I guess method 3 (google drive) or method 1 (secure version of pdf embedder plug-in) have the least pain and prevent direct download and printing of the entire PDF. They both fail with the “scroll to a portion of the PDF and Ctrl-P print it; repeat until I have the full PDF”. You could consider putting a watermark in the PDFs that are viewed online.

I wanted to make sure we could still add links to our PDFs that we can download – like the Membership Application.
cktest1-p4
cktest2-p3


Method 1 – use PDF Embedder Plug-in

I thought this had the greatest chance of working. As you can see the basic “PDF Embedder” Plug-in does prevent direct download of the PDF. Unfortunately, you can simply right-click and “Save Image As…”. If we buy the “secure” version for $30, we can disable the right-click context menu. With the “secure” version they also put the PDFs in a special area so if someone tries to directly download the PDF they get a 403 error. We can do something similar (put in special protected area), but that does involve extra work on our side. The other unfortunate thing is that you can simply Ctrl-P print the webpage and the PDF contents show up. There might be other “pdf embed” type plug-ins which don’t have the “Save Image As…” context menu, but I haven’t looked for them. This plug-in seemed to be the most popular and supported one.

cktest2-p3

Method 2 – use PDF flowpaper Plug-in

This was the method I was thinking of originally. Convert the PDF into a flipbook and embed it in the page. I’ve seen something similar done on other websites. Unfortunate the “flowpaper” Plug-in still allows direct download. Similar to PDF Embedder, I can simply Ctrl-P print the web page and see the contents. They offer a “read-only” version (I think $95) which disables the download/print buttons. But I suspect even with that you can Ctrl-P and get the contents. This free version of this plug-in only supports PDFs upto 15MB which might be a problem. I don’t know how large the AtoZ newsletters are. There are no size limits if we buy their enhanced plug-in. You’ll notice that this plug-in is the slowest to load though.


Method 3 – use Google Drive

This is another “simple” method. We upload the PDFs to Google Drive. You can then set the view properties to disable print/copy/download and embed the resulting view into our pages. It seems to work – no direct way to download the PDF. But you can still Ctrl-P print the page and see the current PDF contents. For a multi-page PDF they simply scroll through and Ctrl-P each page; slow, kludgy, but they can get it. This applies to all the above methods as well.

Check this out! I was wondering can I overlay a transparent image on top of the PDF previewer and set its opacity. We can read through the image to the underlying PDF views but when we print the underlying PDF view is hidden by the foreground image. Similar to Method 4 below. Unfortunately this didn’t work initially. But with some further tweaking/research I discovered you can change the opacity if we are print versus screen. Now when you try to Ctrl-P this page, you’ll see the first Google viewer above, but you won’t see the below Google viewer. This gets a little complex to setup, but nothing like Method 4. Notice that I overlay and size the foreground image so that the scrollbar and bottom controls are available from the PDF viewer. A similar trick should work with Method 1 above.


Method 4 – use background-image tag

I stumbled across this slick idea, but it is time consuming and involved. It isn’t as easy as the above 3 methods. We would first convert the PDF into a series of JPGs. We also create (reuse) a set of transparent GIFs. The idea is to have an <img> of the transparent gif, but underneath define a background-image which is the JPG of each page. So you are seeing through the transparent GIF to the background-image JPG. You can read it, but when you right-click and Save Image As…, what gets saved is the transparent GIF, not the background image (JPG). Pretty slick I thought. Even if you Ctrl-P, most web browsers will only print the foreground <img> images (transparent GIF for us), not the background-image (real JPG); although I just discovered Opera allows you do print the background images.