Git Product home page Git Product logo

Comments (12)

mraible avatar mraible commented on September 25, 2024

That's strange, especially since the proxy should just be sending traffic from 9000 to 8080, not to your external Keycloak instance. Spring Security handles that part and it shouldn't have anything to do with npm start. I've successfully done what you're trying to do with Okta and Auth0 as the identity provider. I haven't tried putting Keycloak on a different server and trying to talk to it, but it should work the same way.

Do you have detailed steps on how to reproduce the problem? I'm looking for something like:

  1. Create an app using the .yo-rc.json in this issue.
  2. Start Keycloak, other dependencies, and then the app.
  3. Run npm run e2e to prove everything works.
  4. Check the project into GitHub.
  5. Open the repo with Gitpod and start Keycloak.
  6. Set an environment variable to override the issuer locally and point it to Gitpod.
  7. Restart the app, run npm start, it fails with the following error (screenshot below).

from generator-jhipster.

naris avatar naris commented on September 25, 2024

Oh, I'm sorry -- I did indeed neglect to put actual step to reproduce the error :(

npm start doesn't really have much to do with the issue as that runs the proxy and if you go directly to the app itself, there is no need to start the proxy.

I have updated the overview -- The detailed steps would be:

  1. Generate a jhipster application using oauth2/openapi authentication, you can either use the .yo-rc.json in this issue or generate a new application by answering the jhipster questions, specifying oauth2/oidc authentication.
  2. set up or use an existing non-local keycloak provider on a different machine
  3. set security:oauth2:client:provider:oidc:issuer-uri: https://<external_server>/realms/<realm_to_use> in application.yml
  4. comment out or remove offline_access from security:oauth2:client:provider:registration:oidc:scope in application.yml
  5. start the application itself with ./mvnw
  6. go to the application's port (localhost:8080) and click sign-in, this will work
  7. start the BrowserStack proxy by running npm start (which also automagically goes to localhost:9000 in your browser)
  8. go to the proxied port (localhost:9000), if not already there, and click sign-in, this will not work and show "Error occurred while trying to proxy: localhost:9000/oauth2/authorization/oidc"

from generator-jhipster.

naris avatar naris commented on September 25, 2024

@mraible , Sorry I did not put the critical step above, I have added it. The problem does not occur when starting the app, it starts just fine. The issue is when someone tries to log in to the app -- that is when it fails and returns the error in the browser.

Error occurred while trying to proxy: localhost:9000/oauth2/authorization/oidc

The npm start session will also have this error:

[webpack-dev-server] [HPM] Error occurred while proxying request localhost:9000/oauth2/authorization/oidc to http://localhost:8080/ [ECONNREFUSED] (https://nodejs.org/api/errors.html#errors_common_system_errors)

from generator-jhipster.

naris avatar naris commented on September 25, 2024

Oh, you also have to comment out offline_access from the scope or you will get a different weird error (even from port 8080) when attempting to sign in
security:oauth2:client:provider:registration:oidc:scope: openid, profile, email # , offline_access # last one for refresh tokens

If offline_access is in scope, after signing in with keycloak, it will be redirected to http://localhost:8080/?error= instead of being logged in :(

from generator-jhipster.

mraible avatar mraible commented on September 25, 2024

from generator-jhipster.

naris avatar naris commented on September 25, 2024

@mraible , no it is not a jhipster-populated instance nor is it in a docker container. We setup a standalone keycloak server and the server doesn't have a jhipster realm, we use the name of the application instead, total-facts, for the realm.
Which is why we set the issuer-uri to https://keycloak-dev.abacus-us.com/realms/total_facts for our server.
This instance always works when going directly to port 8080, it is only when going to port 9000 that logging in doesn't work.
This same instance worked for a couple years, even when going to the proxy port of 9000, before we migrated to jhipster 8.x.

from generator-jhipster.

mraible avatar mraible commented on September 25, 2024

You probably need to configure the web origins in your standalone instance to match what JHipster's Keycloak has. I don't recommend using asterisks (*) because OAuth 2.1 doesn't allow them, but if you match these settings, you should be able to get things working the same as with your JHipster instance.

Screenshot 2024-06-05 at 1 38 39 PM

from generator-jhipster.

naris avatar naris commented on September 25, 2024

We have had those settings for a long time, except for the postman one:
image

from generator-jhipster.

naris avatar naris commented on September 25, 2024

Again, the problem is only when proxying through BrowserStack on port 9000, not when going directly to the application on port 8080 with the version of the application updated to jhipster 8.x The old version of the application still using jhipster v7.x has no issues.

from generator-jhipster.

mraible avatar mraible commented on September 25, 2024

I assume you mean Browsersync, not BrowserStack? If so, does using the version of Browsersync from your 7.x project fix the problem? If not, I'm not sure what's causing the problem.

from generator-jhipster.

naris avatar naris commented on September 25, 2024

Yeah, Browsersync. The odd thing now is that it works with the generated oauth2 sample app from github yet it doesn't work with the app I generated. I initially ran into this issue with my project that was migrated from jhipster 7.x to 8.x so I generated an app with Jhipster 8.3.0 (which was the current version at the time) and it didn't work. I have since generated it again with 8.5.0 and that does not work either. I am using some different settings including, Oracle prod & dev DB, Infinispan caching, openapi, Gatling. I am looking into generating with different options to see what works and what doesn't

Welcome to JHipster v8.5.0


Documentation for creating an application is at https://www.jhipster.tech/creating-an-app/

Application files will be generated in folder: C:\src\totalfact.new-3


? What is the base name of your application? TotalFact
? Which type of application would you like to create? Monolithic application (recommended for simple projects)
? What is your default Java package name? com.epsilon.totalfact
? Would you like to use Maven or Gradle for building the backend? Maven
? Do you want to make it reactive with Spring WebFlux? No
? Which type of authentication would you like to use? OAuth 2.0 / OIDC Authentication (stateful, works with Keycloak
and Okta)
? Do you want to allow relationships with User entity? Yes
? Besides JUnit, which testing frameworks would you like to use? Gatling
? Which type of database would you like to use? SQL (H2, PostgreSQL, MySQL, MariaDB, Oracle, MSSQL)
? Which production database would you like to use? Oracle
? Which development database would you like to use? Oracle
? Which cache do you want to use? (Spring cache abstraction) Infinispan (hybrid cache, for multiple nodes)
? Do you want to use Hibernate 2nd level cache? Yes
? Which other technologies would you like to use? API first development using OpenAPI-generator
? Which framework would you like to use for the client? Angular
? Besides Jest/Vitest, which testing frameworks would you like to use? Cypress
? Do you want to generate the admin UI? Yes
? Would you like to use a Bootswatch theme (https://bootswatch.com/)? Default JHipster
WARNING! Could not fetch bootswatch themes from API. Using default ones.
? Would you like to enable internationalization support? Yes
? Please choose the native language of the application English
? Please choose additional languages to install
? Would you like to generate code coverage for Cypress tests? [Experimental] Yes
? Would you like to audit Cypress tests? Yes

from generator-jhipster.

naris avatar naris commented on September 25, 2024

@mraible, I have found that if I generate a new project with the default ehcahe caching, then it works.
However, if I generate the project with everything the same, except for using infinispan caching, then attempting to log in through the port 9000 proxy fails with the "Error occurred while trying to proxy: localhost:9000/oauth2/authorization/oidc" browser error screen.

from generator-jhipster.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.