how to open specific page on Google's docs viewer

Question

I'm using google's docs viewer to show a pdf document in a html page and I would like to open the document starting on page 20 instead of 1 for example.

There's hardly any documentation about Google's docs viewer service. They say in its webpage https://docs.google.com/viewer that the service only accepts two parameters (url and embedded) but I've seen other parameters searching the web, like "a", "pagenumber", "v" and "attid", none of them did anything to me. I've tried to add #:0.page.19 at the end of my url (that's the id of the div containing page number 20 inside the body google creates) but it just ignores it or works in a random way.

Do you guys know how to tell google docs viewer to show the document starting on a specific page?

Any new solutions that work for this problem? – Tommy Mar 02 '15 at 23:31 — Tommy, Mar 02 '15 at 23:31

score 22 · Accepted Answer · edited Jan 26 '14 at 09:47

I found a solution I'll post here just in case somebody is in the same situation.

Every page inside google's docs viewer iframe has an id like :0.page.X, being X the number of the page. Calling the service like this

<iframe id="iframe1" src="http://docs.google.com/gview?url=http://yourpdf&embedded=true#:0.page.20">

won't work (maybe because the pages ids are not yet created when the page is rendered?)

So you just have to add an onload attribute to the iframe:

<iframe id="iframe1" src="http://docs.google.com/gview?url=http://yourpdf&embedded=true" onload="javascript:this.contentWindow.location.hash=':0.page.20';">

and voilà, the iframe will automatically scroll down after loading.

Note that page indices are zero-based. If you want to view the 20th page of a document in the viewer, you would need use the parameter :0.page.19

It doesn't work for me, if the file you have has a different protocol(http vs https). I keep gettting Unsafe JavaScript attempt to access frame... Is there a solution for this — DavidVdd, Apr 11 '13 at 15:29

score 4 · Answer 2 · edited Jan 14 '14 at 18:41

I found these two ones :

1) just an Screenshot(Image) of specific page (without navigation):

https://docs.google.com/viewer?url=http://infolab.stanford.edu/pub/papers/google.pdf&embedded=true&a=bi&pagenumber=12

2) a link to specific page of PDF in IFRAME (with navigation):

<script>
var docURL='https://docs.google.com/viewer?url=http://infolab.stanford.edu/pub/papers/google.pdf&embedded=true';
var startPAGE=7;

document.write('<iframe id="iframe1" onload="javascript:go_to_page('+ startPAGE +')" src="https://docs.google.com/viewer?url=http://infolab.stanford.edu/pub/papers/google.pdf&embedded=true"width="600" height="400" ></iframe>');
function go_to_page(varr) { document.getElementById("iframe1").setAttribute("src", docURL + '#:0.page.'+ (varr-1) );}
</script>

p.s. then you can have on your website <a href="javascript:go_to_page('3');">go to page 3</a>

score 3 · Answer 3 · edited May 23 '17 at 11:53

3

For me this solution didn't work with the current version of google viewer. Link to specific page on Google Document Viewer on iPad helped me out. Use &a=bi&pagenumber=xx as additonal URL parameter.

edited May 23 '17 at 11:53

Community

1
1

answered Jun 13 '13 at 08:33

FSaccilotto

656
8
13

score 1 · Answer 4 · edited Feb 28 '20 at 22:19

Got it working in the imbed viewer

By changing the url with a timout function, this becous the pdf is not directly shown

$(window).load(function() {
    setTimeout(function() { $('.gde-frame').attr('src', 'https://docs.google.com/viewer?url=http://yourdomain.com/yourpdf.pdf&hl=nl&embedded=true#:0.page.15'); }, 1000);

});

Just copy the imbed url and add your hash for the page (#:0.page.15 > will go to page 15)

You might want to change the language to your own &hl=nl

and for the people how have to support ie8

if you use a boilerplate like this:

you can change the output of the link directly to the pdf like this,

if( $("html").hasClass("ie8") ) {


           $('#linkID').attr('href', 'http://yourdomai.com/yourpdf.pdf');


        };

the pdf will be shown in the pdf reader from IE

score 0 · Answer 5 · edited Oct 20 '12 at 10:28

My PDF is 13 pages, but when I used hash: 0.page.13, it only jumped to page 10. I had to setTimeout and call the same function again:

Only needed to do that once per page load, then it seems to be synched properly. I am sure there is a more elegant solution:

var is_caught_up = false;
function pdf_go(page){
     $('pdf_frame').contentWindow.location.hash=':0.page.'+page;
     if (!is_caught_up){
         setTimeout('pdf_catchup('+page+')', 500);
     }
}

function pdf_catchup(page){
    $('pdf_frame').contentWindow.location.hash=':0.page.'+page;
     is_caught_up = true;
}

how to open specific page on Google's docs viewer

5 Answers5

Linked