Question

I have a WebPage made that is 90% Javascript. All of the WebSite is rendered dynamically.

I want this content to be rendered by the server as well so that Google can crawl and index all of my content and links.

I know that in order not to get banned by google, the content of the dynamic page and the server rendered page must be almost identical.

I don’t want to code two different pages (one from the client with Handlebars and one from the server with ERB in this case).

So I thought of PhantomJS. What I want is that when I get the _escaped_fragment_ param from google, I open the page without that with PhantomJS and I render this to HTML from PhantomJS and return that from the server to Google. This way, I don’t have to create two different pages for anything.

I know that I can use Handlebars for Server Side templating as well, but I’d have to code everything twice anyway.

Does anybody know how to accomplish this with PhantomJS? Is there any other way for not repeating the Logic and code Twice and have Google index the Site?

Thanks!!!

Answer 1

Yes you can.

Add the following to the of your Javascript intensive page

<meta name="fragment" content="!">

When the Google bot finds this tag, it will issue a new http GET request. This time, it will add ?_escaped_fragment_= to your URL.

So if your web page with Javascript is located at:

www.mysite.com/mypage

Google will issue a new GET using the following URL:

www.mysite.com/mypage?_escaped_fragment_=

In your Ruby GET handler, you simply call PhantomJs with the unescaped URL (just do a string replace). In your PhantomJs javascript code, wait for the page to render and then then extract the HTML using regular javascript and return it back to your Ruby GET handler where you will simply respond to the GET with the HTML text string.

In this way you do not have to write your code twice. The solution is generic and will snapshot anything.