Parsing JSON from API Connector Responses

Need help APIs
1

I’m working on an integration to the Notion APIs. One of the key ways Notion works is that Notion pages are just JSON - highly customizable JSON.

So API calls that I make to Notion have a different structure every time they come back to Bubble. (since the structure represents pages that are changing structure within Notion). Some elements of the response to a particular API call are always the same - but not all.

Does anyone know a way to receive a JSON object as part of an API Connector response, then parse through that JSON object in the app (I could use Regex or something to do so). Currently, I haven’t found a way to pass the data through such that Bubble can actually read it.

I tried making the value of properties below a “text” type in the response in the API connector, but it just came in as an Object object that I couldn’t seem to do anything with.

Example

The particular value I need is the properties value - that object changes structure from API response to API response.

{
  "object": "database",
  "title": [
    {
      "type": "text",
      "text": {
        "content": "Grocery List",
        "link": null
      }
  ],
  "properties": {
    "Description": {
      "id": "%5Bh%3A%7C",
      "name": "Description",
      "type": "rich_text",
      "rich_text": {}
    },
    "In stock": {
      "id": "%7DiiS",
      "name": "In stock",
      "type": "checkbox",
      "checkbox": {}
    },
    "Name": {
      "id": "title",
      "name": "Name",
      "type": "title",
      "title": {}
    }
  },
  "parent": {
    "type": "page_id",
    "page_id": "df439dcb-2bd2-4b46-b2db-cab35d796bad"
  },
  "url": "https://www.notion.so/4b120d325cb04961b46b5ce066c3907d",
  "archived": false
}

Whereas another response might be as below; the difference being the Properties object.

  {
  "object": "database",
  "title": [
    {
      "type": "text",
      "text": {
        "content": "Grocery List",
        "link": null
      }
  ],
  "properties": {
  "Food group": {
  "object": "property_item",
  "id": "z%7D%5C%3C",
  "type": "select",
  "select": {
    "id": "2f998e2d-7b1c-485b-ba6b-5e6a815ec8f5",
    "name": "🍎Fruit",
    "color": "red"
  }
},
"Price": {
  "object": "property_item",
  "id": "XpXf",
  "type": "number",
  "number": 2
},
"Cost of next trip": {
  "object": "property_item",
  "id": "Xpaf",
  "type": "number",
  "number": 2
}
},
  "parent": {
    "type": "page_id",
    "page_id": "df439dcb-2bd2-4b46-b2db-cab35d796bad"
  },
  "url": "https://www.notion.so/4b120d325cb04961b46b5ce066c3907d",
  "archived": false
}
2

Hi Brian,
I’m having the same problem right now. Did you find any solution?

3

I ended up building a plugin and handling it in Javascript. :man_shrugging:

1 Like
4

Build multiple JSON inputs as text files - one for each “type”.

Then force Bubble to parse each one as a different Connection.

6

I’m not sure I understand. Can you explain that again?

7

You are halfway there with the examples above.

Firstly, create a new API Connector call.

Then use “Manually enter API response” with your first example.

Now duplicate that call, and use “Manually enter API response” with your second example.

You can now do those two calls to the same API, and filter the objects and use the right structure to pull out the correct fields for each one.

Works OK for a few different structures. Not sustainable once you get dozens.

Very hacky !

2 Likes
8

Thanks for your great explanation. But In my scenario, There will be dozens of different API Calls. So I think, I need to build a plugin with JavaScript.

1 Like
9

Yeah. I really wish there was a better way beyond nasty hack or javascript.

1 Like
10

Would you be so kind to share the code? I’ve spent way too much time trying to solve this one. Really appreciate it!

11

Have the same problem, will be so glad to see your solution, could you share the code?