Comment on page
Learn how to integrate Office365 services with you WEM application, using OAuth 2.0
Office365 offers many services that we can integrate with. E.g.:
We’ve created a template project where you can begin using the Office365 API. In this guide we’ll show you how to set it up.
To be able to safely make use of external providers there’s always some authentication procedure involved. The WEM Modeler already supports the two main standard industry protocols, SAML 2.0 and OAuth 2.0.
In this guide we’ll be using the OAuth 2.0 protocol. Below is a little bit of technical protocol information that helps you understand the actual integration. The OAuth 2.0 protocol requires 5 pieces of information to work properly:
- 1.An Authorization Endpoint, a link where we’ll redirect to when we start the authentication procedure.
- 2.A Token Endpoint, a link which will give us an access token after we’ve successfully validated ourselves with the ‘Authorization Endpoint’.
- 3.A Client ID, this will validate our application to the external service provider.
- 4.A Client Secret, this will also validate our application to the external service provider.
- 5.Redirect URLs, after successfully logging into the external service we’ll be redirected to these URLs.
After retrieving the access token we ’ll be able to use the external service provider’s API.
(An API, application programming interface, is like a toolbox that grants us access to a bunch of useful functions. For example, Outlook’s API allows you to retrieve all your unread mails.)
Let’s say we end up working on our project for a long time. Then it would be nice if we could publish the project right? To be able to do this we first need to link a domain address with our project.
Go to the ‘Project settings’ and configure the hostnames for the staging and live environment. (If the hostname isn’t taken, you can generally use the name of your project and the postfix “.staging.wem.io” or “.live.wem.io” as hostnames.) And with that our hostnames are set up. Don’t forget to save the changes you’ve made!
Click on the authentication provider
Copy and write all the
Redirect URLsdown somewhere. The redirect URLs in our case are:
Azure Active Directoryand after that click on
Click on the button
New application registrationand fill in the form that pops up.
In the text field
Nameyou can enter any name you prefer. In the field
Application typeyou need to select the option
Web app / API. In the field
Sign-on URLyou can enter any URL you prefer, it doesn’t matter which URL you enter.
In the next screen you can see some of the settings of your application. Write down the ‘Application ID’, that will be your client id. After that’s done click on the
Afterwards click on the
Redirect URLsyou’ve written down before, and press the
Click on the ‘Keys’ button.
Enter a new password. Write in the
Descriptionfield any name you prefer, we choose
Client Secret. Select in the
Expiresfield the option
After that’s done click on the
Savebutton. The actual key will now appear in the
Write the key down somewhere, that is our client secret.
Click on the
Click on the
Select all the permissions, this way we aren’t restricted in the way we’ll use the app.
After that’s done, do not forget to click the
Go to the
Click on the
Write down the OAuth 2.0 endpoints somewhere.
For our purposes we need to change the endpoints a little bit, since we’ll be using the 2.0 version of the API. In both URLs add after ‘oauth2/’ the text ‘v2.0/’. The URLs will now look like this:
Click on the ‘Office 365’ Authentication provider.
Write your Client ID and Client Secret in these fields. You’ve written them down in step 4 and step 6.
Write down the appropriate URLs in the ‘Authorization Endpoint’ field and the ‘Token Endpoint’ field. You’ve written them down in step 8. Under the ‘Scope’ field you need to write down ‘mail.read’, what you write down in this field is not that important as long as we do not leave it empty. And with that your authentication provider is done!
The template project can now be used.
Click on the highlighted ‘Preview’ button to try out the template project! It’s recommended to look through all the flowcharts in the project to see how it all works.