SEO for apps made easy
You will need PhantomJS to make this work, as it will render the application to HTML.
Just add this to your <head>
to enable AJAX indexing by the crawlers.
<meta name="fragment" content="!" />
Just add this to your didInsertElement
the event to view in ApplicationView
var App.ApplicationView = Ember.View.extend({
didInsertElement: function() {
var evt = document.createEvent('Event');
evt.initEvent('_htmlReady', true, true);
document.dispatchEvent(evt);
}
});
Just include ajax-seo.js
and then add the seo
module to you app:
angular.module('app', ['ng', 'seo']);
Then you must call $scope.htmlReady()
when you think the page is complete. This is nescessary because of the async nature of AngularJS (such as with AJAX calls).
function MyCtrl($scope) {
Items.query({}, function(items) {
$scope.items = items;
$scope.htmlReady();
});
}
And that's all there is to do on the app side.
For the app to be properly rendered, you will need to run the seo-server-phantom.js
with PhantomJS.
Make sure to disable caching:
$ phantomjs --disk-cache=no seo-server-phantom.js [port] [URL prefix] [no Escape]
URL prefix
is the URL that will be prepended to the path the crawlers will try to get.
Some examples:
$ phantomjs --disk-cache=no seo-server-phantom.js 8888 http://localhost:3000
$ phantomjs --disk-cache=no seo-server-phantom.js 8888 file:///full/path/to/index.html
So say you app is running on http://localhost:3000/
(works with file://
URLs too).
First, run PhantomJS:
Google and Bing replace #!
(hashbang) with ?_escaped_fragment_=
so htttp://localhost/#!/profile
becomes htttp://localhost/?_escaped_fragment_=/profile
.
$ phantomjs --disk-cache=no seo-server-phantom.js 8888 http://localhost:3000/
Listening on 8888 OS: mac 10.8 (Mountain Lion) 32bit
Press Ctrl+C to stop.
Then try with cURL:
$ curl 'http://localhost:8888/?_escaped_fragment_=/profile'
Then try with Browser:
$ open 'http://localhost:8888/?_escaped_fragment_=/profile'
$ phantomjs --disk-cache=no seo-server-phantom.js 8888 http://localhost:3000/ --no-scape
Listening on 8888 OS: mac 10.8 (Mountain Lion) 32bit
Press Ctrl+C to stop.
Then try with cURL:
$ curl 'http://localhost:8888/profile'
Then try with Browser:
$ open 'http://localhost:8888/profile'
Copyright © 2013 Alex Ferreira