Parse JSON inside a widget

Setup, Configuration and Use Widgets
1

Hi all,
I want to show the image of a spotify album. The album id will be set by the widget props. With this ID you can get the URL of the image by the Spotify API. But if you request https://api.spotify.com/v1/albums/{id}
you get all the data:

{
  "album_type": "album",
  "total_tracks": 18,
  "available_markets": ["AT", "BE", "BG", "CY", "CZ", "DE", "EE", "FI", "FR", "GR", "HU", "IE", "IT", "LV", "LT", "LU", "MT", "MX", "NL", "NO", "PL", "PT", "SK", "ES", "SE", "CH", "TR", "GB", "AD", "LI", "MC", "RO", "IL", "ZA", "SA", "AE", "BH", "QA", "OM", "KW", "EG", "MA", "DZ", "TN", "LB", "JO", "PS", "BY", "KZ", "MD", "UA", "AL", "BA", "HR", "ME", "MK", "RS", "SI", "GH", "KE", "NG", "TZ", "UG", "AM", "BW", "BF", "CV", "CW", "GM", "GE", "GW", "LS", "LR", "MW", "ML", "NA", "NE", "SM", "ST", "SN", "SC", "SL", "AZ", "BI", "CM", "TD", "KM", "GQ", "SZ", "GA", "GN", "KG", "MR", "MN", "RW", "TG", "UZ", "ZW", "BJ", "MG", "MU", "MZ", "AO", "CI", "DJ", "ZM", "CD", "CG", "IQ", "LY", "TJ", "ET", "XK"],
  "external_urls": {
    "spotify": "https://open.spotify.com/album/4aawyAB9vmqN3uQ7FjRGTy"
  },
  "href": "https://api.spotify.com/v1/albums/4aawyAB9vmqN3uQ7FjRGTy?locale=de-DE%2Cde%3Bq%3D0.9%2Cen-US%3Bq%3D0.8%2Cen%3Bq%3D0.7",
  "id": "4aawyAB9vmqN3uQ7FjRGTy",
  "images": [
    {
      "url": "https://i.scdn.co/image/ab67616d0000b2732c5b24ecfa39523a75c993c4",
      "height": 640,
      "width": 640
    },
    {
      "url": "https://i.scdn.co/image/ab67616d00001e022c5b24ecfa39523a75c993c4",
      "height": 300,
      "width": 300
    },
    {
      "url": "https://i.scdn.co/image/ab67616d000048512c5b24ecfa39523a75c993c4",
      "height": 64,
      "width": 64
    }
  ],
  "name": "Global Warming",
  "release_date": "2012-11-16",
  "release_date_precision": "day",
  "type": "album",

How can I parse this data inside the widget, to just have the image URL?

2

You could use =JSON.parse() or you can extract that in a rule

1 Like
3

I think this will work, but how do I get the JSON from the URL.

= getJSON()

is not working

4

You’d need to get that in a rule using HTTP Action, or using http binding (more convoluted)

I’m not familiar with getJSON()

5

can I call the rule from the widget? And how can I send the value from widget to rule and rule to widget?

6

Whilst you can call a rule from a widget action (I think), that requires user action, which I don’t think is what you want.

So instead, you have a rule, with the appropriate trigger (cron?, or reacting to some changes?) that fetches the JSON data from the given URL. You can then parse that JSON and extract the bit of information that you want, and then set a String item’s state to that bit of data.

This way your Widget doesn’t need to do any processing at all.

7

Ok I understand. I thought about this Option. But for my planned usecase I need a lot of items. I plan to have a kind of easy to use Spotify library for my Kids. So I wanted to put for each Story a separat widget that shows the album Art.
The best Option to save this pairs would be would be a relational DB. And the Dashboard needs to Loop through the entries

8

I don’t fully understand your application but I’m guessing:

Collect all 50 urls into an array, publish them as json into ONE string item, and use oh-repeater