skip to Main Content

I’m developing application using AngularJS. Everything seems to be nice until I meet something that leads me to headache: SEO.

From many references, I found out that AJAX content crawled and indexed by Google bot or Bing bot ‘is not that easy’ since the crawlers don’t render Javascript.

Currently I need a solution using PHP. I use PHP Slim Framework so my main file is index.php which contains function to echo the content of my index.html. My question is:

Is it possible to make a snapshot of rendered Javascript in HTML?

My strategy is:

If the request query string contains _escaped_fragment_, the application will generate a snapshot and give that snapshot as response instead of the exact file.

Any help would be appreciated. Thanks.

2

Answers


  1. Chosen as BEST ANSWER

    After plenty of times searching and researching, I finally managed to solve my problem by mixing PHP with PhantomJS (version 2.0). I use exec() function in PHP to run phantomJS and create Javascript file to take get the content of the targeted URL. Here are the snippets:

    index.php

    // Let's assume that you have a bin folder under your root folder directory which contains phantomjs.exe and content.js
    $script = __DIR__ ."/bin/content.js";
    $target = "http://www.kincir.com"; // target URL
    $cmd = __DIR__."/bin/phantomjs.exe $script $target";
    exec($cmd, $output);
    return implode("", $output);
    

    content.js

    var webPage = require('webpage');
    var system = require('system');
    var page = webPage.create();
    var url = system.args[1]; // This will get the second argument from $cmd, in this example, it will be the value of $target on index.php which is "http://www.kincir.com" 
    page.open(url, function (status) {
      page.onLoadFinished = function () { // Make sure to return the content of the page once the page is finish loaded
          var content = page.content;
          console.log(content);
          phantom.exit();
      };
    });
    

  2. I recently published a project that gives PHP access to a browser. Get it here: https://github.com/merlinthemagic/MTS. It also relies on PhantomJS.

    After downloading and setup you would simply use the following code:

    $myUrl          = "http://www.example.com";
    $windowObj      = MTSFactories::getDevices()->getLocalHost()->getBrowser('phantomjs')->getNewWindow($myUrl);
    
    //now you can either retrive the DOM and parse it, like this:
    $domData    = $windowObj->getDom();
    
    //this project also lets you manipulate the live page. Click, fill forms, submit etc.
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search