Python - How to export JSON in JS

Question

I want to export a JSON string in python into a JS variable.

<script type="text/javascript">
    var data = JSON.parse('{{ dataJSON }}');
    console.log(data)
</script>

If I print the content of dataJSON I get: [{"offset":0,"total":1,"units":[{"village_id":37,"village_name":"Glim

But in the JS I get this: JSON.parse('[{"offset":0,"total":1,"units":[{"village_id":37

I use jinja2 template engine: http://jinja.pocoo.org/docs/dev/templates/#if

How can I fix that?

What template language are you using? Django, Jinja2, something else? — Martijn Pieters
– Martijn Pieters, Commented Sep 9, 2014 at 14:28

Martijn Pieters · Accepted Answer · 2016-04-19 08:01:28Z

6

You need to mark the data as safe:

var data = {{ dataJSON|safe }};

This prevents it from being HTML-escaped. There is no need to use JSON.parse() this way; JSON is a valid JavaScript subset (at least insofar that the Python json module produces a valid subset).

Take into account that this doesn't make it JavaScript safe. You may want to adjust your JSON serialisation. If you are using Flask, a tojson filter is provided that ensures you get JavaScript-safe valid JSON:

var data = {{ data|tojson|safe }};

If you are not using Flask, post-process the JSON:

dataJSON = (json.dumps(data)
    .replace(u'<', u'\\u003c')
    .replace(u'>', u'\\u003e')
    .replace(u'&', u'\\u0026')
    .replace(u"'", u'\\u0027'))

This is Python code to produce a dataJSON value that can be safely used in HTML (including attribute values) and in JavaScript. Credit here goes to the Flask json.htmlsafe_dumps() function.

edited Apr 19, 2016 at 8:01

answered Sep 9, 2014 at 14:29

Martijn Pieters

1.1m326 gold badges4.2k silver badges3.4k bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Python - How to export JSON in JS

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related