Node-RED: Today using HTTP request to get data from a REST endpoint (https://youtu.be/I_ulT4xRoTA)

yeah once again today is sunday and try out live streaming okay um i got a question around my absolute beginner video with node red so i created a video for you who haven't seen that before it's about starting with node red and the that addresses the major topics how to get data how to pre present data and how to work with with data so just to that you see uh what it does here with that background yeah at least the flow does following it provides an end in ui you can insert data here and you can search for data yeah so we can see here that the data is inserted and i can search for that and for when i search t there's only one data in that and it will not return any information the data is stored in a cloud database yeah and that's the node red flow okay with that that is what's what's currently available and then there were the question yeah that's okay but i want to get data from external source and how can i insert these into my note red flow yeah there are many other thoughts out there on the internet to to do that but i i thought by myself yeah that's a valid question when you start with that how to insert all that stuff and this is how to get the job done and not talk too much about the technology behind it okay the first thing is i i searched for external data source i can easily access and the result of that was that easy consumable rest api called rest countries eu um here you can get information from the eu countries currency language capital city when you ask for the capital city for example here let us see what happens when i copy that address and i insert it in my browser here so i get the country the population and and some additional information so when i know only the capital city and what is behind what is the country related to okay that's the data i will use and then i will put that data with the information of the country into the node red instance i will create a new red flow node red flow inside my existing of red instance here so i will add a new flow and i will also call that to http yeah rest and point so that's what i what i call it yo not forget or if you do a change deploy the change not to be surprised if nothing happens so and um what i do i start with inject because i want first of all to start get the data from inside my flow then i use the http request that is what you use for that if you want to get external data from my external rest endpoint yeah so that is what we are going to use and uh i also want to remind you that it's really cool that inside um not red you have here the description of the notes how the note work yeah okay so that's good stuff okay and do not forget to add a debug node yeah so i say deploy and now i start and i expect nothing will happen yeah so because no url is specified right so now we just take that url and put it into this url okay uh not your in this http request node here here's the url that's a get and that's the um the capital city which is ask for and i'd say deploy run and here we see okay we get the information the information is currently in a string so i want to format the information to make it later easier to consume in our flow in json so that can be done automatically so you can see here put it here it's like that okay it works so and say deploy once again and now we can see here ah yeah i call with and formatted json so we can use yeah uh the question is now um it's cool that we have that information but i want but we want to be a little bit more flexible and we want also to add it to the ui so the first step is answer how we get external data from extern from external resources it's just using this uh rest yeah this http request and put it here for sure in this situation it is easy because we do not have any authentication here so this would be some additional complexity but i don't want to cover that here okay so now we have that and now is the next what we want to do is we want to be flexible with the the capital cities so now is the question when we take a look here at the documentation you can see for example usually can we can use that and copy it for example to replace this here with a variable we use which is from the message object the called topic so and then we have to ensure when we uh inject our note here that the topic here is the topic already given yeah the topic contains the information we want and here we want to get the information from the country by the uh oh which country information [Music] berlin capital city okay so and it's here no the message object with topic berlin okay it works everything is fine go back to the debug node back node is empty and here let's see ah still estonia okay yeah something i i didn't save here or didn't deploy it right yeah just copy it once again [Music] was here to make it a little bit easier i don't want to use my uh my keyboard because i noticed when i use the keyboard i maybe change some settings in addition for the layout of the stream so i don't want to do that and that's the reason why i copy it just information so here um paste it deploy it and clean it up once again and now oh germany you're right so okay now we see okay we can be flexible that's nice what we will do now we want to add that to our uh front end yeah we want to add these to our front end and then we going to add first of all an output here text so and that's the text output here and to make this more observed that is not a part of that what we already did with the absolute beginner flow and again to make it clear um we add a new group another we add a new group here new ui group then we give the or we associate this group to a new tab here i will add a new tab call that tab here http best data okay http rest data here add and here we will create a group to this or we can leave it maybe as a as a default one but maybe also we can edit it's not default i would say is this uh that's country data okay so let us update the front end what happens okay we need the new tab rest data the group we have his interest data in the tab okay and then we're going to define these not as find user call this here is the country for beginner yeah it's about a structure it's not so sometimes not so easy okay but now as you can see um yeah that must you must play around and some even if you did it uh uh some time ago yeah you have to remember it and memorize it but it's cool to have it here for the organization and have the structure um you can see here now we have that that is uh what is related to the flow which we created before what i created before and this is the ui related to the new one that's with the of the country we did it okay the the next is um when we take the data from here with uh from our uh payload here so here we can send it because but we don't want to display everything yeah and then we can say here from the payload we use the the first um array result and that was uh yeah i know i remember here that is maybe from i have to copy it from somewhere is there a bracket ah because when i use that uh the bracket here i remember then i had some problems with the layout so here zero and here we use name so that means okay that's from the area the first entry identicated with null and here the name and that is what we are going to display okay so let us start requesting it the object here and see it's germany oh yeah done yeah now we want also to be a bit a little bit flexible we want also uh to insert the the search name inside our ui here and therefore i use a form well that's the form here next this wasn't sure here i the http rest data foundry data that's the group and with that group we it does also know to which type it belongs yeah and we give the name when we insert it uh because we insert the country with the capital name and i say okay and i say yeah everything that's okay that's the name that's the name data we use inside um our payload yeah you see here so always as i said yeah use the debug so let us go to the um so now here we have the capsule and we see let's say here test i said submit and you see we see capital um once again submit yeah okay that's the input now we need to ensure that format which is format which is given here that is we're using the payload yeah not the topic so we need to change inside our http request node that from topic to payload that means here we go into payload then we know from the pillow that we will use here capital so [Music] put it here put it all to here so and let's see if we get the right result when we insert here a different capital name which is available yeah that's it yeah it works cool yeah bit was yeah how to add data from external rest endpoints yeah it's not so uh complex it was a little bit complex in the ui layout yeah okay yeah um but you can also uh here that's the uh structure i currently have from the dashboard and you can also verify it here but that was at least the most complex thing in that uh in that context and what i would encourage you there are so many other sources out there yeah you can play around with them and a lot of videos and i want to add that live stream that video as an extension to my absolute beginner flow which what i said focuses on the usage of node red for basic things in order for the setup of your eyes and as i said when you were at hackathons i noticed participants not always have the experience in programming and it and and it is easy with node red to build something which is running yeah something new with a minimal usable ui yeah here and you can also insert data from external and that's a good starting point okay i hope that was useful for you and that was my first experience until the end with being live here i was really live here on sunday i tried out on a sunday and i i hope it was useful for you the invested time if somebody watched that first live stream i did here and i say have a nice weekend bye so that now is the question i said bye but how to stop the live stream okay bye

Channel: Thomas Südbröcker

Views: 1,699

Rating: 5 out of 5

Keywords: httprequest, rest, json, nodered, javascript, ibmcloud

Id: F8_x3fRrkj8

Length: 20min 18sec (1218 seconds)

Published: Sun Mar 14 2021