Do I need CORS on API server if API requires Basic Auth from client - ajax

Do I need to activate CORS on my API's server (i.e. return appropriate header in response) if the client connecting to it already provides Basic Auth information.
After lots of googling, the relation between CORS and Basic Auth from the client is still not clear to me . (if there is any relation...)
Does it make sense to have to enable CORS on the server if it already requires Basic Auth from client?
Is Basic Auth supposed to "by-pass" CORS, meaning the server shouldn't have to provided CORS headers as the request from the client is authenticated?
Are CORS and Basic Auth not related at all?
Thanks!

Do I need to activate CORS on my API's server (i.e. return appropriate header in response) if the client connecting to it already provides Basic Auth information.
Yes (assuming you want to allow cross-origin requests).
Auth is there to make that that when Alice's browser requests some data from Bob's website, that Alice is authorised to get that data.
The Same Origin Policy stops Mallory's website from using JavaScript to make Alice's browser request that data from Bob's website and then pass it back to Mallary without Alice knowing.
CORS lets you selectively disable the Same Origin Policy so that Mallory's website can be given permission to get that data.
Are CORS and Basic Auth not related at all?
Correct. They are not.
Further reading

Related

Is Basic Auth still needed when CORS enabled in Spring-Boot?

In my Controller, which is build with using spring-boot, I've enable CORS only for my server and localhost whit this annotation:
#CrossOrigin(origins = {"http://localhost:8080", "https://www.somepage.com"}, maxAge = 3600)
This is working fine. But now I'm not sure, if it's also needed, to add basic authentication for the REST API. As far as I understood, the only call the REST API is accepting now, is my own server and localhost, and that's why, I think it's not needed. But I was not able to figure out, if this is a bad practice or not.
Do You recommend to use basic auth too for the REST API even when CORS is enabled?
No.
The Same Origin Policy is a feature built into browsers that prevents an attacker's JavaScript running on the attacker's website from reading the response to an HTTP request from the victim's browser to the targetted website.
This stops the attacker from stealing data from the targetted website using the credentials belonging to the victim.
(To some degree. There are other kinds of attacks.)
CORS is a tool that relaxes this rule so that when you to allow another site to access that data (either using the user's credentials or because it is just public data), it can.
Note that I said "a feature built into browsers". It isn't built into other tools.
An attacker can still make HTTP requests with their code, or tools like Postman and curl, or their own web browser.
Neither the Same Origin Policy nor CORS are substitutes for authentication and authorization.
CORS is a mechanism implemented in browsers and it will not prevent me to access your API with curl. Therefore, secure your API if you need it to stay secure.

How can I retrieve the Access Token and Bypass CORS Policy in Spring Boot

I implemented an Oauth2 authentication in a GraphQL/Spring Boot API and I want to consume it from the VueJS app using Apollo client ,
Currently, I am able to do that using Postman. But I have an error in Chrome about CORS :
Access to fetch at 'https://server/as/authorization.oauth2?response_type=code&client_id=DEV_CLIENT&scope=api%20profile%20openid&state=sW2aJRg-ZA8vomsiuynS-nS1QobOUJY1Ytrji_gSFz8%3D&redirect_uri=http://localhost:5000/login/oauth2/code&nonce=' (redirected from 'http://localhost:5000/pdp/api/graphql') from origin 'http://localhost:8080' 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.
I implemented CORS config in the API like this :
http.cors().and().csrf().disable()
I contacted the support team, theu told me this : " you are trying to send a CORS request to OIDC services. Please note, we do not have CORS enabled on federation servers. The solution will be to not make any CORS request. "
1 - How can I retrieve the Access Token from the API and use it in the front end in this case (Oauth2) ?
2 - How can I bypass CORS Policy of the server, knowing that they told my it is disabled ?
Thank you
If you cannot control/set the CORS origin policy in the server then there is nothing much you can do from a VUEJS app from the browser. Its the browser which restricts this. You can also ask them if they have jsonp support. Here is a link how to do that.
https://www.freecodecamp.org/news/use-jsonp-and-other-alternatives-to-bypass-the-same-origin-policy-17114a5f2016/
If everything fails, then write up a small backend service which retrieves the Access Token from the API and can pass the token to the VUEJS app in the browser.

If possible, How to authenticate thin server SPA users through backend REST where nginx role limited to serve static content and proxy Backend REST?

I am building SPA with thin server architecture (in my case it mean: webserver role restricted to server static content and route xhr with backend REST services):
so far I failed to find any example that provide user authentication scheme that cover my requirements, when it comes to user authentication all what I see webserver (server side code) involved whether its php/nodejs/asp.net..etc.
I want to build the authentication with zero dependency on server side code that belong to webservers:
details:
user requested login.html.
NGINX served the user request.
user supplied credentials and submit.
Ajax XHR received by NGINX and routed to the Authentication backend REST service.
authentication backend service validated the request and returned response that include session cookie/access token/api key.
Ajax XHR received the response through NGINX, then what? how should I proceed? below are current ideas I have:
a. in many examples (including instagram): window.location.reload();. but in my case reload login.html will not cause NGINX to forward the user to the landing page unless it maintain the authentication logic! so how I can pass this obstacle?
b. in case I redirect the user to landing.html, NGINX will serve it. but again that's not acceptable because every resource request (except login.html) must be validated first (I mean both authentication and authorization).
I hope the question is clear now. I think if NGINX can be configured to pass every request to the authentication backend REST service before it go to the original destination, big part will be resolved though it might be big overhead for auth service!
Your best option here is to use X-Accel-Redirect. This will allow you to pass your requests to the authentication service and then in the authentication service you can run your auth logic and if successful set the X-Accel-Redirect header so that when nginx gets the response it will perform an internal redirect to the resource that you actually want to call. If authentication fails your service can reply with a 401 and not set the header so nginx will provide the proper response to the client.
Your other option, which will be more daunting, is to implement this as a custom Lua module.

Angular CSRF token + ruby api

I'm currently running into a lot of issues with the CSRF token.
Our current setup is a Ruby API and an Angular front-end, both live on a different domain.
The Ruby back-end solely serves as an API for the front-end.
I've spend a lot of time researching this problem, but I can't find a proper solution.
So far the solutions I've found are:
Generate the token and insert it into the DOM (Different domains, so can't do that)
Let the API return the CSRF token on a GET request (Doesn't seem to work, and it's not a good solution since I don't want to make an extra request just to get the token)
So I'm rather stuck here and not sure how to continue.
Is the current implementation just not working? How do other people create an API with oauth without running into this issue?
Not sure if this will help but here is a sample of a simple todo api in ruby with angular as frontend, and i am using token for authentication generated after the user fills username and password.
https://github.com/sirfilip/todoapi/blob/master/app.rb (the api written in sinatra and sequel)
https://github.com/sirfilip/todoapiclient/blob/master/public/js/angular-todoapi-plugin.js (angular client api service that is used for communication with the api)
TL;DR: Secure your rails API with the doorkeeper gem.
This SO post seems to be the accepted answer when your api and client exist on the same domain.
In the post they outline the angularJS docs http://docs.angularjs.org/api/ng.$http :
Since only JavaScript that runs on your domain could read the cookie,
your server can be assured that the XHR came from JavaScript running
on your domain.
To take advantage of this (CSRF Protection), your server needs to set
a token in a JavaScript readable session cookie called XSRF-TOKEN on
first HTTP GET request. On subsequent non-GET requests the server can
verify that the cookie matches X-XSRF-TOKEN HTTP header
It seems that the security of storing and transferring the XSRF-TOKEN session cookie in this way hinges on having your api and your front-end be in the same domain. Since this is not the case, you may have to implement another form of authorization for any given client session, like OAUTH. I'd recommend taking a look at the doorkeeper gem. The gem will give you the ability to interact with your api as if you were any other client.

Cross origin OAuth authentication with ServiceStack

I would like to use my API website for authentication & authorisation of users and ideally keep my UI site purely static content (html, js, css).
I have configured ServiceStack's OAuth & OpenId (and credential/basic) providers, so they answer to api.mysite.com/auth/{provider} requests
I would like to be able to users of www.mysite.com to be able to authenticate and then make calls to the API site via ajax.
The BootstrapApi example project - although very useful - demonstrates the API & website running on the same domain.
Is this possible/secure with a static javascript client?
Could I share a cookie between sub-domains?
Could I return the access token to the client and have use it to calculate an Authorization header before each request?
To address your questions -
Is this possible/secure with a static javascript client? Yes
Could I share a cookie between sub-domains? Yes
Could I return the access token to the client and have use it to calculate an Authorization
header before each request? Sure but you may as well just use the
built in auth cookie.
It's just a matter of setting up your cookies on the top level domain, similar to what's shown # ServiceStack - Authentication for domain and subdomains

Resources