We’ve made a change. Scrapinghub is now Zyte! 

Extract JSONs like a pro with chompjs and JMESPath

time to read
By the one and only
June 3, 2021

Handling javascript objects is an important skill for any web data extraction developer. You might only start dipping your toes into this area when dealing with dynamic pages, but you will then quickly see that <script> tags are a good way to get data in general. At the start it can seem daunting to get data from these nested dictionaries within blocks of javascript code, however, I am going to introduce you to two packages I use to make getting info from these a breeze!

Parse script text using chompjs library

So, let’s assume you’ve extracted this text from a script tag

__DATA__ = {"data":{"type":"@products", "products":[{"id":12345678, "name":"Bacon", "brand": "Some Brand", "price":2.50, "instock": false},{"id":12345679, "name":"Ham", "price":3.50, "instock": true},{"id":12345680, "name":"Beef", "price":1.50, "instock": false}]}};
some_javascript(data) {results = do_stuff(data); return results};
new beep_boop_js_var = some_javascript(__DATA__)

This text has a lot of elements that you don’t want but it also has, what looks a lot like a python dictionary, containing data about a lot of products. That’s a javascript object. Normally you’d have a JSON package to help you turn it into a dictionary. But what do you do when it’s not a clean JSON? Fellow Zytan Mariusz Obajtek made a package to help us in this situation: chompjs.

from chompjs import parse_js_object
script = """__DATA__ = {"data":{"type":"@products", "products":[{"id":12345678, "name":"Bacon", "brand": "Some Brand", "price":2.50, "instock": false},{"id":12345679, "name":"Ham", "price":3.50, "instock": true},{"id":12345680, "name":"Beef", "price":1.50, "instock": false}]}};
some_javascript(data) {results = do_stuff(data); return results};
new beep_boop_js_var = some_javascript(__DATA__)"""

data = parse_js_object(script)

In this case, the parse_js_object function looks through the script to find the first js object, extracts it, and then turns it into a python dictionary. This is just the tip of the iceberg with chompjs, check out the examples on its Github to see other, more difficult formats you can parse easily with it.

Extract data using JMESPath

So, now that you have your dictionary, what’s the best way to get your data out of it? With nested dictionaries, it can be annoying to pick out the fields you need, but you can make it much easier by using another package: JMESPath.

For example if you want to get the list of products from that dictionary, you can do that with a single function call:

jmespath.search('data.products', data)

It doesn’t stop there. Let’s go one step further - say you want the names of the products? You can do:

jmespath.search('data.products[].name', data)

The change here indicates that I want to go through the products list and pull out the name fields, this will leave me with a list of product names. Now, while that is already very useful, we can go a bit deeper. 

Say you want the dict for only one of these products - the one called “Bacon”. Well, we can actually enter a query within the square brackets to filter our results:

jmespath.search('data.products[?name==`Bacon`]', data)

As before, we can also pull a specific field out:

jmespath.search('data.products[?name==`Bacon`].price', data)

Now, let's do something a bit more interesting. Say I want to find products that are over a certain price. Well, I can do other sorts of conditionals in those brackets too:

jmespath.search('data.products[?price>`2`], data)

You may have noticed that only one of the items has a brand, so if I was to do the following it would give me just the brand name for that one product. Take care in this case as if there are incomplete results you won’t know which of the dictionaries this data actually comes from:

jmespath.search('data.products[].brand', data)

Finally, you may have noticed that the instock field in our sample has a boolean value, so if we wanted to only get the names of all in-stock items we can do it as so:

jmespath.search('data.products[?instock].name', data)


These two packages are probably two of the more important packages I use when I am extracting web data. Many sites will typically use standard JSON or js scripts in their source, which chompjs can extract for you. With these cases and also most API responses you likely end up with nested dictionaries, which JMESPath makes sifting through a breeze.

If you would like to see a video of these packages in action, check out my video on Youtube.

Check out other useful open source packages for parsing HTML and extracting data:

Written by Roy Healy
Sign up to the blog