I’ve added * to the Web Origins for my NodeJS Connect client as well as my NodeJS API client. I’ve also added enable-cors: true to my keycloak.json. Even with both of these, I still can’t redirect to Keycloak from my NodeJS API. Note that I'm not using the JS client. The keycloak.protect() function is trying to tell the browser to redirect to Keycloak but it won't because of the missing CORS header. Is there anything else I need to do to enable CORS?
Related
i am new to AWS, i deployed a MERN application in it as follows:
front end on S3 bucket with web hosting enabled;
backend (node, express and graphql) on an ELB;
these two apps are put behind a cloudfront distribution as origins.
the app works fine but a cookie that i am setting is not received by the browser:
the other thing that is bothering me is that the access-control-allow-origin header is set to * although i have the cors policy set in my app to my particular domain.
the cookies are set in development but once i push the code to the server it does not work.
any help is much appreciated.
I made it work but i am not sure what i exactly did. the thing here is that cloud front doesn't not forward the set-cookie if you don't tell it to do so.
I just needed to update the Cache key and origin requests options that you find when you try to update a behavior like this :
Google signin works fine on my nodejs app via http (on Google App Engine).
But when tried via https - below error is received. Im using Google App Engine auto managed SSL.
The redirect URI in the request,
http://www.example.com/api/auth/google/callback, does not match the
ones authorized for the OAuth client.
The problem seems to be - my nodejs app in google app engine does not know the traffic is coming from https - I am using express - how to resolve this ?
Paths in google cloud console for oauth to use http and https are correctly set.
In Developer console you set up some Redirect URIs to use with your client credentials.
You are currently trying to make a request and sending
http://www.example.com/api/auth/google/callback
As your redirect uri that is has not been added as a valid one. You either need to add as a valid one or better yet try sending from https://www.example.com/api/auth/google/callback instead
My node.js knowledge is pretty basic but check your OAUTH2_CALLBACK
I am trying to get the nodeJS keycloak adapter working with my Express application, but am facing a CORS issue when it tries to redirect to the login page for routes I have protected with the keycloak middleware:
XMLHttpRequest cannot load
http://192.168.132.44:8080/auth/realms/Actora/protocol/openid-connect/auth?client_id=actora-test&state=0e9c9778-c41b-4aa8-8052-d0f0125045ac&redirect_uri=http%3A%2F%2Flocalhost%3A5001%2Fauth%2Fchecktoken%3Fauth_callback%3D1&scope=openid&response_type=code.
Response to preflight request doesn't pass access control check: No
'Access-Control-Allow-Origin' header is present on the requested
resource. Origin 'http://localhost:5001' is therefore not allowed
access.
In my keycloak client settings I have added a single value of '*' to the Web Origins config section.
I have also enabled cors on my node express application using the node cors library, following this express guide here
var cors = require('cors'),
app = express();
app.use(cors());
app.options('*', cors()); //enable for all pre-flight requests
I using version 3.2.1 of keycloak in case that makes any difference (I see a new version is out as an RC)
Has anyone faced similar issues and managed to resolve? I have been digging through many JBOSS mailing list threads and other stackoverflows, and all seem to suggest its as simple as adding the '*' entry to the web origins config section for the client on the keycloak admin site but this is not the case for me.
Thanks
I am also working on this issue with mindparse.
I think the key issue here is that the keycloak server is not responding with any ACCESS-CONTROL-ALLOW-ORIGIN headers despite the fact that he has correctly configured the "web Origins" setting in the keycloak admin portal.
A more in depth flow of the process is:
The user attempts to call a keycloak secured route on a node express server
Keycloak middleware detects that the user is not authenticated and
responds to the request with a 302 (redirect) to a custom login page hosted
by the keycloak server.
The browser sends an OPTIONS request to the keycloak server to check if it is
because it is a cross origin request.
The keycloak servers response DOES NOT include the ACCESS-CONTROL-ALLOW-
ORIGIN header to tell the browser that it has permission to make this
request.
The browser then reads this response and therefore does not make the follow
up request because it did not pass the access control allow origin checks
Just put the url of your app like "http://localhost:8081" in "Web Origins" field of client settings in Keycloak.
I had the exact same problem. I am using Keycloak 6.0.1
In my case, I had to add "enable-cors": true in keycloak.json in my Java backend server.
Afterward, I had another issue: 401 UNAUTHORIZED.
This post solved the problem
Web Origins must be set correctly for a configured client, yes, but it too has some pitfalls because a "+" setting depends on other values.
E.g., I had this wrong configuration for local tests:
Root URL: http://localhost:3000/
Valid redirect URIs: *
Web Origins: +
... and it failed with a CORS issue like you describe.
The issue lay with the other two settings, so this is correct and works now:
Root URL: http://localhost:3000
Valid redirect URIs: /*
Web Origins: +
(The KeyCloak UI is a usability nightmare on many fronts, imo, this is just one pitfall)
I also faced CORS issues while trying to connect to KeyCloak, even though I had correctly filled out the "Web Origins" url.
Turned out I accidentally connected to the wrong App (Client) and tenant (Realm), therefore not passing the CORS checks. Pointing to the right app and tenant fixed my problem.
I have a nodeJS express app, that serves front end app using React and also provides an API. The React app calls the backend API and as such there is no cross origin.
When I deploy this to Bluemix without SSO, everything works fine. When I deploy using SSO service I get error
Fetch API cannot load https://abcd-9bgrvudk1p-ct20.iam.ibmcloud.com/idaas/oidc/endpoint/default/authorize?response_type=code&client_id=Z4eSiL50dT&redirect_uri=https%3A%2F%2Fconsole-sso.mybluemix.net%2Fauth%2Fsso%2Fcallback&scope=openid%20openid.
No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://console-sso.mybluemix.net' is therefore not allowed access. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
I tried calling the API directly and after SSO auth, it works fine, But when the API is invoked by the front end app, it returns the above error.
FYI, API target is https://console-sso.mybluemix.net/api/reports/daily-reports
I have followed the Single Sign On documentation
I tried adding CORS module and response headers to allow a CORS request but it did not work. I also tried adding * to SSO configuration to allow all origins but no luck. Any pointers would be great! Thanks
This will require Support to review. Please open a ticket with the BlueMix support team
I have a backend server and I configured CORS filter to allow my frontend server to access backend public api. Now I want start developing mobile app, which also will communicate with backend server, but I can't simply put all origins in my cors filter. Should I set Access-Control-Allow-Origin to * ? If so, will it be secure enough ? I don't keep user sessions, but with every request users send jwt token.
If you are developing your own mobile app, then you will not need to have to change any CORS setting in your backend. Setting Access-Control-Allow-Origin to wildcard i.e * will make it very unsafe as all sites will be able access public APIs from your site. Access-Control-Allow-Origin is used by different browsers such as Chrome, Firefox, Opera etc to verify if the frontend accessing the API from the backend is allowed to access the content. This is check only takes place if your APIs and your frontend are on two different domains or subdomains. Eg foo.com frontend is trying to access content from bar.com then your backend Access-Control-Allow-Origin needs to be set to foo.com.