Implement OAuth Auth code flow for SKY addin

piyumi perera
piyumi perera
Third Anniversary Facilitator 1
in SKY Developer General Discussions

Hi all,

I am new to SKY add-ins and I am trying to implement Auth code flow as the Auth flow for my add-in. I tried with given sample codes for .net core and node.js. But I need to do it with Angular frontend and .net core backend. I need to know how can I open a popup to do the Auth flow. I tried to open oauth url and do it.

But I need to it inside the addin code. I followed this link to create sample add-in.

Comments

  • Michael Tims
    Michael Tims Blackbaud Employee
    Sixth Anniversary Kudos 2 Name Dropper Participant

    Hi @piyumi perera - sorry, I don't believe there's a sample that demonstrates an Angular front end with .Net Core backend. The Barkbaud (NodeJS) sample may be closest since it does us an Angular SPA for the front end, the backend being Node.

    In that sample, you'll see there's an Angular service that calls the backend server to authorize a user. You'll call a .Net Core backend in a similar way… For the .Net Core backend, you can redirect a user to the SKY API authorization consent form by redirecting a request to the authorization URL, the node server code has an example of this.

    In a .NET Core service, during an authorization request, your controller would do something like this:

    ```

    // redirect to oauth
    var authUrl = _settings.OauthAuthorizationUrl;
    var clientId = _settings.OauthClientId;
    var redirect = System.Web.HttpUtility.UrlEncode(_settings.OauthRedirectUri);
    var fullUrl = $"{authUrl}?response_type=code&client_id={clientId}&redirect_uri={redirect}";

    var uri = new Uri(fullUrl);
    return Redirect(uri.ToString());

    ```

    where `Redirect` comes from AspNetCore ControllerBase. Hopefully this helps! Please reach out if you have anymore questions.

  • piyumi perera
    piyumi perera
    Third Anniversary Facilitator 1

    Michael Tims:

    Hi @piyumi perera - sorry, I don't believe there's a sample that demonstrates an Angular front end with .Net Core backend. The Barkbaud (NodeJS) sample may be closest since it does us an Angular SPA for the front end, the backend being Node.

    In that sample, you'll see there's an Angular service that calls the backend server to authorize a user. You'll call a .Net Core backend in a similar way… For the .Net Core backend, you can redirect a user to the SKY API authorization consent form by redirecting a request to the authorization URL, the node server code has an example of this.

    In a .NET Core service, during an authorization request, your controller would do something like this:

    ```

    // redirect to oauth
    var authUrl = _settings.OauthAuthorizationUrl;
    var clientId = _settings.OauthClientId;
    var redirect = System.Web.HttpUtility.UrlEncode(_settings.OauthRedirectUri);
    var fullUrl = $"{authUrl}?response_type=code&client_id={clientId}&redirect_uri={redirect}";

    var uri = new Uri(fullUrl);
    return Redirect(uri.ToString());

    ```

    where `Redirect` comes from AspNetCore ControllerBase. Hopefully this helps! Please reach out if you have anymore questions

    Thank you very much for your support and will try for this.

Categories