Servoy and oAuth 2.0

Welcome everybody to today’s tech webinar and we’re still in servooy 2019 O3 launch mode and today we’re also going to be announcing servooy world during this session and I’m actually live from a servooy client in Canada ProSoft XP was kindly hosting me today and quite some content to cover so let’s get started John. Okay well happy first day of spring right today’s the Vernal Equinox I think it is yeah was it 24th I’m not sure I can’t remember I think I think it was today and today I I think that it’s also coincides with the super moon which is when the full moon is the closest point in its orbit and its full and it coincides with the Vernal Equinox which is I think pretty special so because everything is aligned I think we should be announcing servooy world 2019 in this webinar we’re gonna make you wait until the end of the webinar because you know we have to do that but the good news is everyone in this webinar will get a bit of early jump on registration because we don’t do a full public announcement until the end of today North America time so that gives everyone in this webinar a chance to get in and get their hotel rooms booked because I think there’s a limited availability this year at the main conference hotel so if you are interested then stick around to the end of the webinar and we’ll post the information and the links but today we’re gonna be discussing continuing our launch series the Q1 build from 2019 is in release candidate one actually release candidate two is now built and will be released tomorrow but will be in release candidate mode for probably another week or two as we get to the cases and fix those and make sure everything is stable last webinar in case you missed it it was all about the no CSS theming we’re working hard to remove the requirement that you must no CSS from the product of course you can always use it if you want to that one is recorded and will be posting the recording very shortly in case you missed it today’s webinar is about an OAuth plugin which is included in the 2019 O3 build so now it’s more baked into the product and allows you to do various API integrations so I’ll do a short demo and then we’ll do some overview on on OAuth itself so I’m going to go into Servoy developer and launch the ng client and the example I want to show you is very simple and won’t take very long and then we’ll kind of walk through how it was done and do a bit of overview and then we’ll talk about Servoy world so I expect that we will be a pretty quick webinar today and the use case here is primarily what a lot of companies are doing now which is sort of outsourcing their authorization or giving the option to outsource authorization to their platform and so you can use something like Google or LinkedIn or some other big identity management platform to verify who you are one of the benefits of this is that if you allow your users to log in to your application using for example their LinkedIn account then you don’t have to go through the trouble of having them register their username and their password and sending them their password and or password resets and all that stuff so that can be quite useful and it’s pretty easy to build and it all hinges on a technology called OAuth which is in its second iteration OAuth 2.0 and it’s the process by which one application can grant permissions to another application by sort of passing control to the user momentarily and that’s what I’m going to demonstrate right now so I’ve arrived at my generic application here I can log in or I can connect with LinkedIn so I will click this button here it’s now passing control away from my application to the LinkedIn authorization page and because there are some local storage it already knows who I am if I was running an incognito mode in my browser for example I would be required to authenticate with LinkedIn with my username and password for LinkedIn but because it sets some cookies and tracks what I do it already knows that it’s me I’m going to click allow and you can see you can see what it’s giving access to you have some control over this depending on what the service is but it’s just going to get my basic profile and my email address now it returns control to my application and you can see I have a wonderful one form application here but I’ve pulled in my profile information from LinkedIn upon authorization so this is quite handy because if you are registering people for a SAS application and you want them to type in their email and you know their information and create a password and all that you’re also kind of counting on them to not give you their you know junk email that they never check and then you don’t really know who they are and you have no way to reach them this is quite nice because it really does verify their identity and you’ll be able to capture a lot of information like what company they work for which then you can get more information about from LinkedIn like a number of employees etc if it’s if it’s shared so you can see that I’ve pulled a few things including the email address so that’s typically what is used as a unique identifier in an application and also the profile picture which is you can show them a picture of themselves that’s a picture of me and I guess people like to see a picture of themselves so that’s the demo it is quite short but that that’s good because it makes things very simple and let’s take a look at how it’s done I want to start with that main login page let me clean up some space here and Servoy developer so you can see that I have this button connect with LinkedIn and if I look at the properties of that button I have a small event in the form I made a a method called initialize I made a small scope to sort of wrap the LinkedIn service but this is not this is not anything special this is just what I set up this morning to sort of wrapped around that plugin but here you see where we talked to the plugin the first thing you have to do when you’re using OAuth is to provide the what’s called the client ID and client secret those two bits of information are standard in the OAuth protocol every service that that provides OAuth as its authentication scheme will have a client ID and client secret now that is not the ID of the user who’s logging in this is the ID of the application that is being granted access to a user’s LinkedIn profile for example so I’ll show you where I obtained this in a minute but the the plugin that is now included in the Q1 build of Servoy has the ability to do a LinkedIn call and what I pass into to is that client ID and client secret which tells me it’s you know my demo app and also this is something called scopes these two bits of information here scopes is another part of the OAuth standard and these are what you’re granting access to or what you’re requesting access to in fact and that is basic profile and email address and you saw that when it it passed control to LinkedIn that it had two bullet points there and one was basic profile one was email address so it literally showed me what the demo app is asking for finally there is a callback because the way OAuth works is it’s kind of a multi-step process you pass control to the to the service and then it does the authorization and then it does a redirect back to or where wherever you specify but in this case back to this application and then it passes in an authorization code which you can then keep as a token and send with multiple or subsequent requests so on authorizes the callback so those are kind of the the main ingredients to getting started it’s just one line of code but then you have to handle that on authorized method that is actually handled as a deep link so I’ll take you to what happens next the deep links by the way work best if you put them in in a global scope so a top level scope that’s actually named global.js even though you can name scopes whatever you want so if I sort of find this method and I’ll use my Servoy resource locator I have it here on authorized and what it passes in is the this is the standard Servoy deep link protocol but it passes that code in as an argument called code and then I just forwarded back to that LinkedIn scope that I made and and I do a few more things one is I set the access token that was passed in back into the service object that I made when I initialized it and the next thing I do is I just load the profile which is this method here and so this is the next time that I use the plug-in the next time that I call the service here’s where things become a bit more customized because you have to know a bit about the service that you’re using and what it what the endpoints are and what it expects and what it returns so I consulted the LinkedIn API documentation and found it pretty easy to specify what fields I want from the profile and I put those here they get built into the URL here and then I called this OAuth plugin again online 90 to generate that that service request for that URL endpoint and then I get back the result I specify that I wanted as Jason in the header here some some services do that automatically some are XML by default unless you say Jason so again that’s where you have to consult the documentation but here I get that profile object and it has all the fields that I requested and I just sort of copied those into some fields that I’m tracking in this scope up top and that’s what that form is bound to including that picture URL which I was able to put on the form so that was pretty much the the full round trip and to end I think it’s worth showing you a bit about how to set this up on the on the service side because there’s some things you have to do on the the API that you’re using so if I go back to my browser here first I’d like to point out that if you go to linkedin.com slash developers that’s where you you’ll find your where you can register your your your your your application so if I go to my if I go to my homepage here you can see that I have a recent app so I have already created this app and it has some some information on there and if you go to the off section you can see the client ID and the client secret so those get generated for you and you have to know those back in your integration that’s what I passed into to the plugin to initialize the service then there are the the the different permission names or they call them scopes sometimes you have to know these by name because you also pass in a list of them because this is the options that you have for what you want to grant permission to and I had picked basic profile and email address but you can go a step further if you’re a company admin then you can specify access to that as well as to things that you have shared etc so so that’s the next bit of information to know and then finally you have to know excuse me the redirect URL that you’re going to need and then you have to register them here so as a matter of security I can’t just call linkedin and say I want to you know authorize and then it’s going to redirect anywhere it has to be already registered so that in here it was you can see I was testing some things but it was this middle one here this on authorize that was the method that got called via deep link so you have to register the callback URL so it’s really those those few steps when you’re testing this it you’ll notice that once you’ve authenticated it kind of remembers you and so the next time you come in it won’t pass control again because you yourself as the linkedin user are already granted you’ve already granted access so it won’t always go to that login page where you log in through LinkedIn if for testing reasons you want to well I’ll show you what that looks like so if I I’ll close the application and I’ll relaunch the ng client and this time when I connect with LinkedIn it didn’t pass control it went directly and got my profile information because I’m already saying yeah this demo Servoyapp can use my profile right if I wanted for testing purposes to go and kind of remove that so that I can test the workflow again I come in here to my own personal linkedin account and go to partners and services and I probably have to refresh this because I had removed it yeah so there you can see that that I’ve I’ve allowed Servoyaccess to my application and I can come in here and remove this the next time I access the application it’s going to it’s going to pass control back to linkedin and require that I reauthorize it before it goes further so that’s just something that’s nice to know when you’re testing and most services and not just linkedin will have this so that you can go in and you know control with applications can access your information on their platform and that’s a good way when you remove that to keep retesting that sort of authorization workflow I’m gonna just do a just a quick overview of some slides about what OAuth is and we’ll take some questions and we’ll do the Servoyworld announcement so just the OAuth and we’re now in the 2.0 version of that and have been for a few years is an industry standard for allowing applications to talk to each other but it puts the user in the middle and gives the user control over which applications have access to which platforms it’s also a developer specification for how the authorization workflow will proceed and that’s why we’re able to build a plugin that provides provides this workflow for you so that you don’t have to do a lot of the low level programming I should point out that the plugin is right now designed to work with Facebook LinkedIn and Office 365 Active Directory Services if we need to add more services we can but what we decided to do is kind of bake those into the plugin so that you don’t have to go and and re-implement different you know service endpoints we can also look at shipping a helper module like I made that little LinkedIn scope to kind of wrap those transactions as well but anyway the back to the overview what you can do with OAuth is you can get secure access to a third-party platform you can get two applications to talk to each other without ever exposing any credentials so it’s not like you’re sending your LinkedIn password into the demo Servoyway app or anything like that and I think the third point is what’s nice for for software vendors is that you can use a third-party platform as an identity management system and you can start to outsource that and remove that burden from your own application okay we’ll take some questions but first and I’ll leave this up while we take questions so server-wide world will be this year in November November 6 through 9th the conference days are always it’s always two days and those will be the seventh and the eighth we typically do a pre-impost conference training however this year we’re gonna do something fun we have a hackathon scheduled on the pre-conference training and the simultaneous ISV summit but the hackathon will be I think a lot of fun and a lot of way to get some energy into the start of the conference there will be I think a way to enter as teams and I think what will will do something like a small fee for it that will result in a donation to charity for the hackathon we’re still working at the details for that and then on the the ninth after the conference will do four half-day workshops instead of full-day trainings and I think what we’ll plan to do is to make these a bit more interactive than they’ve been in the past so not just straight-up classroom trainings but we’re gonna get lots of server-wide experts in the room and we’re gonna do we’ll cover it’ll be topical and we’ll cover these topics with server-wide experts in the rooms with you to help you so not just teach your student kind of set up in a full-day setting we’ll do four half-day workshops and two separate tracks the link below is for you to register I’ll leave that up during the question and answer session so you can you can copy that down and get in and get registered if you are one of those people that likes to be in early bird beyond do we have any questions yeah there’s a couple of questions coming in and if anybody has any then feel free to post them now there’s a question from Imra is post new LinkedIn update or comment implemented currently in this plugin well the the plugin itself doesn’t do anything with LinkedIn it just it just gives you the authorization hook so once you are authorized then you can send request to any endpoint that the API provides so yeah if you want to comment or like things on the LinkedIn and I don’t know the details of the API and support for that but if the API supports it then you can use the plugin to do this and you have to use OAuth to do that you can’t talk to any endpoints in the service without that authorization token okay so it’s good to keep in mind that this is a generic OAuth plugin and not a LinkedIn specific plugin which leads to the next question of Ruben is it possible to use a custom OAuth provider like WS02 Identity Server which supports OAuth and OpenID Connect yeah absolutely that’s that’s one of the I think one of the biggest benefits of this technology and the plugin is that you can outsource that that authorization step to and now there’s the you know lots of consumer facing products will do the social platforms like Google or LinkedIn or Facebook and you know log in with one of those but a lot of the business SAS offerings are now starting to use some of these security companies which do identity management as a service companies like OCTA we did a webinar on OCTA several episodes ago and not only did we show identity management as a service but then it had baked into it some extras like multi-factor authentication so can send you a SMS code or email code for a two step and it managed all that for you all of that runs on top of OAuth as a way of verifying between these two applications who the user is cool and one final question where can I get this plugin okay it is shipped with the latest version of Servoy so the 2019.03 release the Q1 release which was released a few weeks ago as a release candidate the RC to build will be available tomorrow and it will go final in a few weeks so if you go to Servoy.com slash download that’s where you can get the the installer for that if you’ve already installed it and you want to run an update you can use the update site any clips there’s instructions for that on the form as well but it’s it’s in the installation so you don’t have to go to any web package and install it it should be there currently as I said before we support LinkedIn and Facebook and Office 365 please reply to the form thread or send me an email directly if you are interested in another service because it’s not really much work to add additional services that are based on OAuth because it is a standard protocol okay there’s a follow up question is this plugin different from the one that I found on Servoy forage okay yeah there there was an earlier incarnation of this kind of same plugin on Servoy forage I believe that was based on OAuth 1.0 so this would be you ever all these companies are now on OAuth 2.0 so you probably don’t want to use that plugin maybe we should also kind of deprecate that project on Servoy forage as a third-party website but I believe we were contributors to that so we probably want to deprecate that and direct everyone to this new plugin which is shipped inside Servoy I also want to point out there is another OAuth project floating out there so just to avoid confusion there’s a module available through the web package manager called SVYOAuth and that also does the same thing but it’s it’s a little bit more do it yourself so you have more control but then you also have more work to do also it’s based on on the Google client libraries and so there’s a bunch of jar files that you have to include so the setup of it is a bit clunky and not so nice it does require that you program a bit more than than what I showed you today so probably the way forward is that project will be deprecated as well and everything will be supported inside the so off plugin so please file feature request send emails to me post on the forum for your API service integration needs because if they run on the OAuth standard it’s fairly easy to add them to be supported all right and what if I want to use this plugin in an older version of Servoy it’s a good question I hadn’t thought of that it is it is a standalone plugin I I don’t know if it has any dependencies on the core of Servoy I think I think it was actually available in one of the rebuilds of 8.4 so if you were to download Servoy 201903 and copy the jar file from from that plugin folder into your into your plugin folder in whatever build you’re using you could test it I don’t know if there are any dependencies on any libraries in Servoy core though that’s they’ll have to take that one offline but you can try it the way I described by copying it in okay it’s good to know all right that’s it for questions today so yeah for those eager to subscribe to Servoy world then now is the time to do that we will be announcing it to the rest of the world very soon so if you want to be quicker then it’s up to you what’s up for the next one so we’re looking to do an episode on an update on using grids in Servoy so that’ll be in in two weeks cool put up some useful links here as we close out don’t forget to download Servoy it’s Servoy.com slash download you can watch any recordings of any prior webinars this is number 54 so there’s a lot in our archive at the tech series homepage and please give your questions comments and abuse on the forum thread. Excellent well thanks a little for attending and we will see you in two weeks thank you

Close