[Reposted from an older thread that appears to have been unread.. ... We're new here, so please forgive any newb errors, like posting too late or in the wrong location. Advice on this is very welcome ... ]
OAuth 2.0 (3LO) issues:
We are building an internal message system to display some company wide data, including the status of Jira Issues for each of our teams. We're writing this in VueJS. The data is obtained (successfully) from the Jira API, and passed to a Google Chart. Up to this point, we've been satisfied using Basic Authentication to get things up and running, but are now trying to implement OAuth 2.0. It's proving difficult. There are very few examples here and other places online, and those we've seen don't include much detail as yet.
In particular during our OAuth2.0 (3LO) authorization we are able to retrieve an authentication code successfully in step 1 as outlined in the documentation. This code is then parsed from the URL into the second 'exchange' to receive a token as outlined in step 2 in the same documentation.
Documentation: https://developer.atlassian.com/cloud/jira/platform/oauth-2-authorization-code-grants-3lo-for-apps/
However, when trying to retrieve the token the response errors out with a 401 and is:
{"error":"access_denied","error_description":"Unauthorized"}
Multiple attempts have been made to check for syntax errors - however the authorization and syntax we use is identical to that found in the Jira API documentation (as far as we can tell).
We are at a loss as to what could be causing this. Our code is posted below - with the user data omitted. (We're convinced it was accurate as well before deletion). Hopefully explanation and code provide enough information for some others to provide help and/or hints that we and others might be able to use.
(If you've read this far, thanks so much for your interest and patience!)
Paul and Dave
Relevant Code:
// This code works fine.
oAuthTwoAttempt: function () {
var redirectURL = `https://auth.atlassian.com/authorize?audience=api.atlassian.com&client_id=xxxx&scope=read%3Ajira-work&redirect_uri=http%3A%2F%2Flocalhost%3A3000&state=5555&response_type=code&prompt=consent`
this.redirectedRecently = true;
window.location.href = redirectURL;
},
// Extracting the code from the URL
getParameterByName: function(name, url) {
if (!url) url = window.location.search;
name = name.replace(/[\[\]]/g, '\\$&');
var regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)'),
results = regex.exec(url);
if (!results) return null;
if (!results[2]) return '';
return decodeURIComponent(results[2].replace(/\+/g, ' '));
},
// This function causes the 401 error response. The server will respond successfully - just with an error.
oAuthExchange: function () {
var authCode = this.getParameterByName("code", window.location.search);
console.log("Auth Code: " + authCode);
var headers = {
"Content-Type" : "application/json"
};
var jiraData = //'{"grant_type": "authorization_code","client_id": "xxxx","client_secret": "xxxx","code": "' + authCode + '","redirect_uri": "http%3A%2F%2Flocalhost%3A3000"}'
{
"grant_type": "authorization_code",
"client_id": "xxxx",
"client_secret": "xxxx",
"code": authCode,
"redirect_uri": "http%3A%2F%2Flocalhost%3A3000"
}
console.log(jiraData);
fetch(
'https://auth.atlassian.com/oauth/token',
{
method: "POST",
headers: headers,
data: jiraData
})
.then(response => {
return response.json();
})
.then(jsonData => {
});
}
