I am getting empty page after updating a Frontend URL for the default Master Realm. Below is the screenshot of the realm settings. I am using Keycloak 18.0.0 version.
Can anyone please help me out
I would like to set a Keycloak redirect url. After click on Sign out button in template.ftl template which is set in account directory
It is represented by list item:
<li>${msg("doSignOut")}</li>
How it is now:
I'm redirect to the main site of keycloak (actually it is a site of login into keycloak)
What I want:
change this site and redirect user to main page of project. How can I define it as
I use Keycloak version 12.0.2
I haven't found any appropriate settings in realmName.json file or Administration Console which is available at http://localhost:8088/auth/admin/master/console/#/realms/realmName
I am setting up a community website with a Strapi CMS backend and a NuxtJS frontend using the composition API.
Besides the normal registration and login using email and username (which works!), I want users to be able to login using GitHub.
I am using #nuxtjs/auth module for authorization.
I've "deployed" my Strapi backend using ngrok. This is needed apparently to make OAuth work.
I've set up my GitHub application, using <ngrok-url>/connect/github/callback as the callback.
I've set the GitHub client_id and secret in my .env file.
In the strategies in my nuxt.config.js file I have this:
github: {
clientId: process.env.GITHUB_CLIENT_ID,
clientSecret: process.env.GITHUB_CLIENT_SECRET,
},
I've added a line in config/server.js of the Strapi backend:
url: '<ngrok url>'
So the backend is fired up in that location.
In my Strapi configuration, I've enabled a GitHub provider, and I need a redirect url to my frontend there. I am not sure what to put here.
I've tried: http://localhost:3000 (my Nuxt app port), but then I get a redirect uri mismatch error ("the redirect uri must match the registered callback"), when I try to access it from the frontend (using nuxt-auth's loginWith('github)').
More info on this here, but I don't get what they are saying.
Provide a redirect_uri where?
And they say to have a redirect_uri that matches what you registered. That matches what exactly?
The nuxt-auth docs are not that elaborate, saying to use $auth.loginWith('github') and that's it. I do this in my frontend, but I'm not sure if that is all I should do.
I can go manually to "<ngrok-url>/connect/github" (in ingognito) and login there in GitHub and I get redirected to the url I put in Strapi, with the access token as a parameter. So that part seems to work.
My main 2 question are:
How do I make the correct call from the frontend to the right endpoint to login through GitHub?
How do I process the result of that call?
Any help is much appreciated!
Update #1
I added a property redirectUrl on the github strategy in nuxt.config.js with the <ngrok-url>/connect/github/callback. That fixes a redirecting issue from GitHub.
I also added a redirect in Strapi to localhost:3000/connect/github and added a page in nuxt following this solution.
Now, I get back a jwt token and a user from Strapi, but $auth.loggedIn is still false in my front end. I'll try to fix this by writing my own middleware. I think this is needed because the app is server-side rendered.
The issue was that loginWith('github') connects nuxt directly to github. But we want to go to Strapi first. So in the end, I removed all the github-related info in my frontend and made a regular <a> with href to <strapi-url>/connect/github and then handled the response in a vue page like so:
data() {
return {
provider: this.$route.params.provider,
access_token: this.$route.query.access_token,
}
},
async mounted() {
const res = await this.$axios.$get(
`/auth/github/callback?access_token=${this.access_token}`,
)
const { jwt, user } = res
await this.$auth.setUserToken(jwt)
this.$auth.setUser(user)
this.$router.push(`/`)
},
To test it locally, I used ngrok to fire up the backend in a tunnel, instead of localhost.
If you want to look at more code, check out my PR here
Our team is working on a project that integrates into Keycloak. We created a custom realm, say ProjectX and enable our custom theme on it to be applied in the login page of Keycloak.
Since our theme is applied on the realm ProjectX and not in master, then how can we default the custom realm to be displayed(with the theme) when we first access the keycloak login page?
Not sure which project you are building and how you are configure keycloak in your ProjectX project. Ok lets ignore all these thing and see how we generally browse keycloak .We Simply hit https://<IP ADDRESS>:<PORT>/auth then it will show some link and we click to Administration Console and it will redirect to MASTER realm url.
Which look like this https://<IP ADDRESS>:<PORT>/auth/realms/master/protocol/openid-connect/auth?client_id=security-admin-console&redirect_uri=https%3A%2F%2F135.250.138.93%3A8666%2Fauth%2Fadmin%2Fmaster%2Fconsole%2F%3Fredirect_fragment%3D%252Frealms%252Fbasic-auth%252Ftheme-settings&state=47381ff9-eb03-4419-bac3-8824d57f9c0d&nonce=be95ef5a-0737-49a3-be0b-4577f7a050ae&response_mode=fragment&response_type=code&scope=openid
Now in your case you want to access the url for particular realm and not default(Master) realm,So here is the Solution hit below url.
https://<IP ADDRESS>:<PORT>/auth/realms/<REALM-NAME>/account
But make sure you created user for your realm and give proper rights to particular user.
I'm currently developing on my server, not on my personal computer, but it seems to be impossible to tell it to Meteor, as I'm trying to use Facebook login. The expected login url for app.example.com is
https://www.facebook.com/dialog/oauth?client_id=<client id>&redirect_uri=http://app.example.com/_oauth/facebook?close&<more junk>
But I always get
https://www.facebook.com/dialog/oauth?client_id=<client id>&redirect_uri=http://localhost:3000/_oauth/facebook?close&<more junk>
I'm using Nginx as a proxy for Meteor server, so I should be able to access it pointing to app.example.com, but Meteor seems to not detect it. Where is it changeable?
You should set the environment value ROOT_URL before executing meteor, i.e.
ROOT_URL=http://app.example.com meteor run