2

I want to implement oauth in my office add-ins for that I found office js dialog api and go through it and found it is interesting.

My concern is that I want to implement it with angular 2 so I am not able to make good flow of that.

Expected Result should be

  1. Home page ( Currently simple html page but i want it is part of angular 2 component)

  2. User will select for login

  3. Dialog open for Login

    (In dialog first local page and then its redirect to some custom domain page that is outside of current domain)

  4. Callback

  5. Load menus and data after successfully log-in.

After completing oauth, I am loading my angular 2 app. I want to do that full cycle with angular 2 app.

jonrsharpe
  • 115,751
  • 26
  • 228
  • 437
Hardik Shah
  • 387
  • 2
  • 11

1 Answers1

1

Have you had a chance to take a look at Office Helpers? It will assist you in doing OAuth very easily.

I am not sure about your specific scenario but assume you want to authenticate with StackOverflow API, then you'd do the following:

async function authenticate() {
    /* Invoke the library */
    let authenticator = new OfficeHelpers.Authenticator();

    /* Register the OAuth provider by passing a name and the configuration */
    authenticator.endpoints.add('StackOverflow', {
        clientId: '<client id goes here>',
        baseUrl: 'https://stackexchange.com',
        redirectUrl: 'https://localhost:3000',
        authorizeUrl: '/oauth/dialog',
        scope: '<scope goes here>',
        responseType: 'token',
        state: true /* generate a random state */
    });

    /* returns a token or an OAuth Error */
    return await authenticator.authenticate('StackOverflow'); 
}

If you have further questions feel free to post an issue or comment here.

WrathOfZombies
  • 90
  • 1
  • 7
  • Also for a regular dialog, you can take a look at http://stackoverflow.com/questions/41940581/office-js-dialog-api-and-multiple-displays-with-high-dpi/41944277#41944277 – WrathOfZombies Mar 21 '17 at 17:40