Same template looks different: playground vs online

  • Hi!

    I've been fiddling for a while with my ASP.NET Core webapp, where I send my razor view html to js report online. The interesting thing is, when I run it with the local binary it looks fine, but with the remote client and using jsreport online it looks completely different (different text size, formatting, etc). If I upload the html template and css to jsreport online manually and run it there, it still looks wrong. However, if I use the Playground, it looks fine, the same as with the local binary, with the same HTML and CSS. The settings are the same, everything is the same, what could be wrong?

    Here is the playground link which looks good, however copy-pasting the same HTML + Css into jsreport online, it looks bad:

  • Actually I figured out the difference: In Playground using 1.9.8 PhantomJS it looks corret. With 2.x it's wrong. In jsreport online with 1.9.8 PhantomJS it looks wrong, but with 1.9.8-windows it looks correct and the same as with 1.9.8 PhantomJS in Playground. Playground uses Windows deployment and the online one Linux?

    Update: Shame on me, I just checked the PhantomJS PDF recipe page which states the exact thing. Unix and Windows environments differ. Then I guess really the online and Playground versions are different.

    Is there a way to enforce 1.9.8-windows phantomjs when running the remote client from my webapp?

  • administrators

    @Oszkar-Sziklai yes! playground uses Windows and Online uses Linux. unfortunately when using phantomjs the output will have some differences depending on the OS in which the rendering is happening.

    there are some workarounds:

    probably some of the workarounds will help you in having the same content with the same layout in different OS.

  • Additionally, you can also enforce jsreportonline to use the windows phantomjs using this following global custom script. Just create it in jsreportonline, mark it as global and you are done.

    function beforeRender(req, res, done) {
        if (req.template.recipe === 'phantom-pdf') {
            req.template.phantom =  req.template.phantom || {}
            req.template.phantom.phantomjsVersion = '1.9.8-windows'

    However make sure to understand the difference. The linux rendering is currently better choice for scale and critical rendering.

  • Perfectly working with the global config for 1.9.8-windows (Should be fine for the low volume). Thank you very much, awesome product!

Log in to reply

Looks like your connection to jsreport forum was lost, please wait while we try to reconnect.