Search code examples
angularoauth-2.0jira

Can I use an OAuth 2.0 service (like the Jira API) with only a frontend app?


This seems like it should be a simple question, but for some reason I cannot find a clear answer or wrap my head around the larger concepts.

I am looking to make API calls into our Jira Cloud Instance using OAuth2 (following the Jira documentation here: https://developer.atlassian.com/cloud/jira/platform/oauth-2-3lo-apps/) and I am not clear whether I can do this with a frontend app only (in my case Angular) or if I need my own backend app on a server in order to do this.

The two images on the Atlassian documentation page make it seem clear that I don't need something like a Node server in order to implement this, but when I Google looking for tutorials or examples, I don't find any.

Are there any examples or repos that I could look at that that anyone knows about here?

All help is much appreciated!


Solution

  • You can implement an OAuth 2.0 based login for some providers using plain JavaScript.

    CLIENT AUTHENTICATION

    Yet Atlassian requires a client secret and there is nowhere safe in the browser to store it, so you need to supply it using a backend component.

    Your app can connect with Atlassian via a reverse proxy, a utility API, or via your own authorization server (AS). In the latter case, the AS could provide the Atlassian client secret, and the connection from the frontend to the AS could use PKCE.

    BROWSER BEST PRACTICES

    These days, it is recommended for browser based apps to use a backend for frontend, such as a utility API, as part of their OAuth flows. This keeps tokens out of the browser, and reduces the impact of cross site scripting exploits. The BFF also supplies an OAuth client credential when getting tokens from the AS.

    IN YOUR CASE

    I would start by developing a small backend component to assist your frontend. This does not need to change the architecture of your Angular app.