Load JSON immediately for SPA instead of AJAX? (Python=>AngularJS)

Question

I have access to a Response object in my python backend for returning HTML pages, etc. I can declare headers, content-type, etc.

Instead of re-engineering the Python to use something like Django/Flask (which would allow me to parse JSON data on the backend and stick in right on the page), could I do something like add an arbitrary response header key to hold my initial JSON that needs to load on the page, then parse that JSON with my AngularJS? Or is this bad practice /a lazy & dirty hack?

The HTML Page I return contains all the necessary tags to call JS that makes the app run and do Ajax requests as the user interacts with the app, but I really would like to pass on JSON during the initial load without rebuilding how our Python serves HTML files / templates.

Answer 1

I'd rather embed the json in the page content than in a header.

Best practice for embedding arbitrary JSON in the DOM? on stackoverflow has some suggestions, such as using a <script> tag or a data- attribute.

Just make sure to encode/escape it appropriately, so that an unexpected string value can't break the parsing of your html (leads to xss vulnerabilities).

Answer 2

Response headers are not available from javascript so the proposed solution would not work for you.

I don't know your setup but less than a complete framework should be able to handle this task. You can insert an empty script tag with an id in your html file. Then you can parse the file using a html parser, replace the content in the script with

var myData=JSON... 

Before you serve the file.