New App type, CORS support and Office 365 API's with vanilla-js

Few months back Microsoft introduced several new API’s for Office 365 for which spun across SharePoint, Exchange, Lync, and rather than having the developers learn each of the platform they simplified the general concepts and also introduced a new type of app - “Office 365 external Apps”

These apps look similar to “Provider Hosted Apps” but the have some key difference in the way you register them and launch them. For more details visit: http://www.sharepointnutsandbolts.com/2014/12/office-365-apps-and-sharepoint-apps-comparison.html

Along with this new type of Apps, Microsoft has also enabled cross-origin resource sharing (CORS) support for Office 365 API’s.
Which means we do not need any special client libraries to authenticate or access these API’s.

Let’s see how we can register this new type of app and then integrate it using vanilla-js.

Step 1 – Register your App

• Sign in to Azure Management Portal
  
• From Active Directory node select the Active Directory linked to your Office 365 subscription
  
  
  
• Click “Applications” tab from the top navigation
  
  
  
• Click “Add” from the bottom of the screen and select “Add an application my organization is developing”
  
  
  
• Provide the app name and select Web application and/or web API as Type
  
  
  
• Provide the Sign On URL of your web app in which you are integrating the API’s
• Provide any unique ID of your App in App ID URI
  
  
  

Step 2 – Configure permissions for App

• Open the application and click “Configure” tab from the navigation
  
  
  
• Scroll down and click “Add Application” under “permissions to other applications”
  
  
  
• Click “+” next to Office 365 SharePoint Online and save.
  
  
  
• For Office 365 SharePoint Online, open delegated permissions dropdown, select appropriate permissions
  and save the application
  
  
  

Step 3 – Configure the App to allow OAuth implicit grant flow

• On the configure tab, click on “Manage Manifest” button from the bottom and download the manifest
  
  
  
  
  
• Set the value of "oauth2AllowImplicitFlow" to true and upload the manifest file.
  
  
  
  
  
• The application registration is complete now…
  

Step 4 – Integrate it with a Web Page

• Authenticate
  
  
  
  
  
• Call the REST API with Authorization Token
  
  
  
  
  
• Fetch document list from SharePoint
  
  
  
  
  

See complete code on github..

Other Resources:

• Setup Office 365 dev environment
• ADAL JS & CORS with Office 365 API’s
• Key skills for SharePoint/Office 365 developer
• .Net and JavaScript client libraries for Office 365 API’s
• Office 2013 modern authentication public preview

.

.

.