0
votes

I am trying to connect my React app to the Jira Cloud API and can't seem to get past a 403 error.

My code currently does a Auth dance using OAuth 2.0 and returns the token and cloudid. I can use this to GET issues, however POST request (like creating an issue) return with 403. I have found here that this error is returned if the user does not have the necessary permission to access the resource or run the method.

I have ensured the user has the correct scope ([write: jira-work, read: jira-work]) and verified this is reflected in the user account (in their account > connect apps tab).

My app is not linked (via ApplicationLink) or installed (via Apps, Manage Apps), is this necessary to perform POST requests?

Here is a sample of my code:

fetch(`https://api.atlassian.com/ex/jira/${jira.cloudid}/rest/api/2/issue/`, {
    method: "POST",
    headers: {
        "Content-Type": 'application/json',
        "Authorization": `Bearer ${jira.token}`
    },
    body: JSON.stringify(data)
})
.then(...)

Neither api version 2 or 3 are working for this POST request. I have explored using Basic Auth however this fails due to CORS errors.

I have verified that the POST request does work in POSTMAN (using the cloudid and token).

---------------------------------------------------------------------------------------------------------------------------

UPDATE

After talking to Atlassian Staff, there is an issue within their API security:

"By trying the same thing you mentioned I think I found what the problem is. Your request likely fails with a ‘XSRF check failed’ in the browser. I’ve already talked to one of our security engineers and we quickly dived into the implementation code to confirm why this not working and what would need to be changed on our side. We’ve also already opened a engineering ticket to get this addressed. This will likely take a few weeks to get addressed, but I’ll keep you posted if I hear any updates!"

The XSRF check failed was the main error for my 403 response. I'll post any updates I receive and answer the question when a resolution is found.

1
The request code shown in the question causes your browser to make a CORS preflight OPTIONS request before even trying the POST request from your code. What’s the HTTP status code or the response to that OPTIONS request? (Use the Network pane in browser devtools to check.) Is the response to that OPTIONS request a 200 OK or is that 403 error actually the response to that OPTIONS request?sideshowbarker
I notice that the docs at developer.atlassian.com/cloud/jira/service-desk/rest show examples of calling the API with curl and from Node.js, Java, Python, and PHP code, the docs don’t contain any mention or examples of using it from frontend JavaScript code running in a browser. So it seems likely the API’s not actually intended to be used from frontend JavaScript code. So it’s like not CORS-enabled — and more specifically, doesn’t support OPTIONS requests.sideshowbarker
Here is some of the response from the network tab: Status: 403 Access-Control-Allow-Origin: localhost:3000 X-XSS-Protection: 1; mode=block Access-Control-Allow-Credentials: true X-Content-Type-Options: nosniff Vary: Origin, Accept-Encoding X-Frame-Options: SAMEORIGIN Strict-Transport-Security: max-age=315360000; includeSubDomains; preloadCharklewis
I'm assuming due to the SAMEORIGIN policy, it is rejecting this request. Is it normal for APIs like this to allow GET but not POST in this context?Charklewis
The response shown in your comment indicates my speculation about the API not being CORS-enabled was wrong. The response indicates the API is actually CORS-enabled. So the problem is unrelated to CORS at least.sideshowbarker

1 Answers