How can I solve the CORS error when accessing the Jira API?

[Lukas]

Hey folks,

I am working on a small Figma plugin and would like to access information (status, name) of Jira tickets. However, when I try to fetch data I get the CORS error

Access to fetch at 'https://[companyname].atlassian.net/rest/agile/1.0/issue/DT-25' 
from origin 'https://www.figma.com' has been blocked by CORS policy: Response to preflight 
request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present 
on the requested resource. If an opaque response serves your needs, set the request's mode to 
'no-cors' to fetch the resource with CORS disabled.


The Figma docs say the following

Note: because Figma and Figma plugins run inside a browser environment, Cross-Origin Resource Sharing policies apply. Plugins run inside an iframe with a null origin. This means that they will only be able to call APIs with Access-Control-Allow-Origin: * (i.e., those that allow access from any origin). In the example above, we use a CORS proxy for simplicity, but it’s not something you generally need to or should use.

Does this mean that ultimately I will not be able to access Jira (unless they add the Access-Control-Allow-Origin on the server side)? Or is there any way to get around this?

Thanks
Lukas

[Neil · Accepted solution]

@Lukas Welcome to the community. Just an FYI, for development-related questions, I recommend you check out our Developer Community at https://community.developer.atlassian.com.

That being said, here's a thread that can help address your question: https://community.developer.atlassian.com/t/cors-error-with-rest-api/27354

TL;DR - CORS is supported with OAuth 2 3LO apps. If you're using the standard rest API (with basic auth and API tokens), the only way that you can bypass CORS would be by hosting a proxy service that you'd make the calls through (because it's the browser that's enforcing cross-origin policies).

[Lukas]

Thanks a lot! So that means unless I create a proxy, users will have to log in to access the ticket info? 

Next time I will post my issue in the correct community... Thanks!

[Neil]

With an OAuth 2.0 3LO app, each user using your integration would need to go through the auth flow. 

Now.. if you were making API calls through a proxy in order to circumvent CORS, it begs the question as to which credentials you'll be using to make those API calls. If this is just an integration for your own internal/personal use, you could create/use an account API token (an auth token bound to your individual account, which you would use to authenticate using basic auth -- email as the username, token as ythe password).

If you wanted to make API calls on behalf of a user, I recommend going the 3LO route.

[Vitalie Andries]

Hi Neil,

from all sources I concluded that there are 2 ways to send a e.g. `rest/api/3/issue/issueIdOrKey` request : 

1) OAuth 2 3LO way - https://developer.atlassian.com/cloud/jira/platform/oauth-2-3lo-apps/

generate client id/secret to -> get code to -> get access_token to -> set Header `Authorization: Bearer ${access_token}` & and make the api call

and simple
2) https://developer.atlassian.com/cloud/jira/platform/basic-auth-for-rest-apis/

email:api_key -> Header: Authorization `Basic: ${base64_encoding(email:token)}` -> api call

What is not clear is in  WHICH case I must implement server side proxy (to avoid CORS)
?
OAuth 3LO ? Basic? Both? Only for (some) intermediate steps?

My Final target is to be use a mobile app to interact with jira
(web app as intermediate phase)

at some point I was able to send jira api requsets (in browser)  using access_token (received via postman)

Thanks.