Express/connect middleware to pre-render ajax page for non-ajax browsers, especially using angular.js
Express/connect middleware to pre-render ajax page for non-ajax browsers, especially using angular.js
$ npm install connect-prerenderer
In app.js:
var express = require('express');
var prerenderer = require('connect-prerenderer');
var app = express();
app.use(prerenderer());
...
global.console
to window.console
when prerendering filestruthy
, do the rendering in a subprocess (it helps to prevent possible memory leaks in jsdom). You can also set the RENDERER_USE_SUBPROCESS
environment variable to any value (except an empty string) to achieve the same result. Try it if you experience memory leaks.<body data-prerendered="true">
document.onprerendered()
The following snippet would help AngularJS to work:
<script>
angular.element(document).ready(function() {
if (document.body.getAttribute('data-prerendered')) {
document.addEventListener('click', function() {
document.removeEventListener('click', arguments.callee, true);
angular.bootstrap(document.documentElement, []);
return true;
}, true);
} else {
angular.bootstrap(document.documentElement, []);
}
});
</script>
To keep templates for interpolation in a prerendered html,
use the modified version of angular.js
(v1.2.5)
located in test/server/public/
.
style
attributes are not preserved by jsdom (use class
).AngularJS only limitations:
ng-repeat
workaround only works with ng-repeat
attributes.ng-repeat-(start|end)
is not supported.