Add support for Auth0 #782

mraible · 2022-06-02T22:03:37Z

Describe the bug

Currently, this blueprint mostly works with Auth0. However, logout does not work.

Instructions To reproduce

This blog post shows how to reproduce. There's a section at the bottom with a possible solution.

JHipster app's .yo-rc.json

https://github.com/oktadev/auth0-full-stack-java-example/blob/main/.yo-rc.json

Entity JDL or JSON files

https://github.com/oktadev/auth0-full-stack-java-example/blob/main/flickr2.jdl

Versions (please complete the following information):

JHipster React Native Version: 4.2.5

The text was updated successfully, but these errors were encountered:

ThakurKarthik · 2022-08-27T11:50:34Z

Hello, new to jhipster ! I was trying to do the setup of app following here https://deploy-preview-1024--okta-blog.netlify.app/blog/2022/06/15/react-native-spring-boot Right now I am getting some 401 error from axios, is there an community help channel where I can ask for help ?

Also looking into this doc https://github.com/jhipster/generator-jhipster-react-native/blob/main/docs/oauth2-oidc.md#log-out-from-the-identity-provider-iosandroid isn't logout disabled by default ?

mraible · 2022-08-27T13:55:07Z

I've tested this blueprint with Keycloak and Okta and successfully logged out. Auth0 does not work for logout because their openid-configuration does not contain an end session endpoint. We need to implement a workaround for this.

I hope to try and bring this library up-to-date in the next few weeks if time allows.

mraible · 2022-08-27T13:55:52Z

As far as a community help channel, this is the best spot to get help.

ThakurKarthik · 2022-08-27T14:07:45Z

I've tested this blueprint with Keycloak and Okta and successfully logged out. Auth0 does not work for logout because their openid-configuration does not contain an end session endpoint. We need to implement a workaround for this.

I hope to try and bring this library up-to-date in the next few weeks if time allows.

Yeah project is using expo 42 which is not supported in the expo go app, I had too upgrade to expo 44 just to make it work.

mraible · 2022-08-27T15:02:02Z

I'm happy to review and merge and PRs you contribute! If you have time, of course. 😊

ThakurKarthik · 2022-08-28T15:05:15Z

I realised my mistake, I had to do source .auth0.env file and restarted the server with ./mvnw I was able to login but had to add this "https://auth.expo.io/@karthik.01/Flickr2" to my callback url in the auth0.

coming to the other part, it looks like I am also able to logout without any issue.

VID_20220828203154.mp4

mraible · 2022-08-28T16:24:10Z

Yes, it does look like you can log out from the app. However, does it log out from Auth0 too? If you click login again, does it prompt you for credentials, or does it just log you right in?

ThakurKarthik · 2022-08-28T16:49:26Z

Yes, it is asking for credentials again.

mraible · 2022-08-28T16:55:39Z

Cool! I'll give it a try this week.

mraible · 2022-08-30T04:38:13Z

@ThakurKarthik See the PR that fixes this issue to see what I had to do to make logout work with Auth0.

mraible · 2022-08-30T06:41:28Z

How did you upgrade to Expo 44? I've succeeded in getting it to work with web and iOS, but login fails on Android.

ThakurKarthik · 2022-08-30T10:05:13Z

Hello I think I followed this guide for upgrade https://blog.expo.dev/expo-sdk-44-4c4b8306584a

mraible · 2022-08-30T13:22:05Z

I tried using the instructions from that guide:

npm i -g expo-cli
expo upgrade

Then I tried npm i and npm start. I get an error when trying to run it on Android:

› Opening exp://192.168.7.78:19000 on Pixel_2_API_31
✔ Expo Go on Pixel_2_API_31 is outdated, would you like to upgrade? … yes
Uninstalling Expo Go from android device Pixel_2_API_31.
› Press ? │ show all commands
Android Bundling failed 9532ms
error: node_modules/react-native-reanimated/src/index.ts: /Users/mraible/Downloads/auth0-react-native-jhipster-example/mobile/node_modules/react-native-reanimated/src/index.ts: Export namespace should be first transformed by `@babel/plugin-proposal-export-namespace-from`.
  5 | export * from './reanimated1';
  6 | export * from './reanimated2';
> 7 | export * as default from './Animated';

I tried adding the react-native-reanimated plugin to babel.config.js:

module.exports = function (api) {
  api.cache(true);
  return {
    presets: ['babel-preset-expo'],
    plugins: [
      'react-native-reanimated/plugin',
    ]
  };
};

Suggestion found here.

Then, I cleared my cache with expo r -c and tried npm start again. It warned me that I might be using the wrong commands:

This command is being executed with the global Expo CLI. Learn more.
To use the local CLI instead (recommended in SDK 46 and higher), run:
› npx expo start

Since npm start just results in a screen with a bowtie (and nothing more), I tried npx expo start and hit r to reload the app. The app loads, but Expo crashes.

I ran adb reverse tcp:8080 tcp:8080 and tried npx expo start again. This time, I was able to complete the login flow, but I get a Login dismissed error at the end. In my console, it shows:

Android Bundling complete 3790ms
 LOG  Account - FAIL
 ERROR  {"type": "dismiss"}

Did you experience anything like this?

mraible · 2022-08-30T13:29:06Z

If I open Android Studio and monitor the logs, this is what I see before the error:

2022-08-30 07:27:34.321 708-933/? D/PeopleSpaceWidgetMgr: Sbn doesn't contain valid PeopleTileKey: null/0/host.exp.exponent
2022-08-30 07:27:34.323 3001-21011/? W/NetworkScheduler: Error inserting flex_time=3567000 job_id=-1 period=7136000 source=16 requires_charging=0 preferred_network_type=1 target_class=com.google.android.gms.measurement.PackageMeasurementTaskService user_id=0 target_package=com.google.android.gms tag=Measurement.PackageMeasurementTaskService.UPLOAD_TASK_TAG task_type=0 required_idleness_state=0 service_kind=0 source_version=222615000 persistence_level=1 preferred_charging_state=1 required_network_type=0 runtime=1661866054320 retry_strategy={"maximum_backoff_seconds":{"3600":0},"initial_backoff_seconds":{"30":0},"retry_policy":{"0":0}} last_runtime=0 [CONTEXT service_id=218 ]
    android.database.sqlite.SQLiteConstraintException: UNIQUE constraint failed: pending_ops.tag, pending_ops.target_class, pending_ops.target_package, pending_ops.user_id (code 2067 SQLITE_CONSTRAINT_UNIQUE)
        at android.database.sqlite.SQLiteConnection.nativeExecuteForLastInsertedRowId(Native Method)
        at android.database.sqlite.SQLiteConnection.executeForLastInsertedRowId(SQLiteConnection.java:940)
        at android.database.sqlite.SQLiteSession.executeForLastInsertedRowId(SQLiteSession.java:790)
        at android.database.sqlite.SQLiteStatement.executeInsert(SQLiteStatement.java:89)
        at android.database.sqlite.SQLiteDatabase.insertWithOnConflict(SQLiteDatabase.java:1702)
        at android.database.sqlite.SQLiteDatabase.insertOrThrow(SQLiteDatabase.java:1597)
        at bezs.g(:com.google.android.gms@[email protected] (190800-461192076):52)
        at beyl.n(:com.google.android.gms@[email protected] (190800-461192076):3)
        at beyl.u(:com.google.android.gms@[email protected] (190800-461192076):20)
        at beyl.h(:com.google.android.gms@[email protected] (190800-461192076):3)
        at beuc.run(:com.google.android.gms@[email protected] (190800-461192076):9)
        at xot.c(:com.google.android.gms@[email protected] (190800-461192076):6)
        at xot.run(:com.google.android.gms@[email protected] (190800-461192076):7)
        at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1167)
        at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:641)
        at xty.run(:com.google.android.gms@[email protected] (190800-461192076):0)
        at java.lang.Thread.run(Thread.java:920)
2022-08-30 07:27:34.332 1247-1247/? I/GoogleInputMethodService: GoogleInputMethodService.onFinishInput():3420 
2022-08-30 07:27:34.332 1247-1247/? W/KeyboardViewController: KeyboardViewController.show():477 Requesting to show sub view with id 2131428268(#0x7f0b03ac) when keyboard HEADER view is not ready to show
2022-08-30 07:27:34.332 1247-1247/? I/GoogleInputMethodService: GoogleInputMethodService.onStartInput():2002 
2022-08-30 07:27:34.333 20891-21193/? E/ReactNativeJS: { type: 'dismiss' }

ThakurKarthik · 2022-08-31T11:29:11Z

I tried using the instructions from that guide:
npm i -g expo-cli
expo upgrade
Then I tried npm i and npm start. I get an error when trying to run it on Android:
› Opening exp://192.168.7.78:19000 on Pixel_2_API_31
✔ Expo Go on Pixel_2_API_31 is outdated, would you like to upgrade? … yes
Uninstalling Expo Go from android device Pixel_2_API_31.
› Press ? │ show all commands
Android Bundling failed 9532ms
error: node_modules/react-native-reanimated/src/index.ts: /Users/mraible/Downloads/auth0-react-native-jhipster-example/mobile/node_modules/react-native-reanimated/src/index.ts: Export namespace should be first transformed by `@babel/plugin-proposal-export-namespace-from`.
  5 | export * from './reanimated1';
  6 | export * from './reanimated2';
> 7 | export * as default from './Animated';
I tried adding the react-native-reanimated plugin to babel.config.js:
module.exports = function (api) {
  api.cache(true);
  return {
    presets: ['babel-preset-expo'],
    plugins: [
      'react-native-reanimated/plugin',
    ]
  };
};
Suggestion found here.

Then, I cleared my cache with expo r -c and tried npm start again. It warned me that I might be using the wrong commands:
This command is being executed with the global Expo CLI. Learn more.
To use the local CLI instead (recommended in SDK 46 and higher), run:
› npx expo start
Since npm start just results in a screen with a bowtie (and nothing more), I tried npx expo start and hit r to reload the app. The app loads, but Expo crashes.

I ran adb reverse tcp:8080 tcp:8080 and tried npx expo start again. This time, I was able to complete the login flow, but I get a Login dismissed error at the end. In my console, it shows:
Android Bundling complete 3790ms
 LOG  Account - FAIL
 ERROR  {"type": "dismiss"}
Did you experience anything like this?

Yes I had to add the reanimated plugin to babel.config file, I followed the same SO link :) I also removed the expo cache and It ran without issue. One thing I noticed is if you make this value to false for android platform I was getting the same Login dismiss log message. Apart from this I had to turn off the remote debugging for the app otherwise it was not loading at all. This is the local changes for my package.json file

diff --git a/package.json b/package.json
index 7a898d4..96f0a5f 100644
--- a/package.json
+++ b/package.json
@@ -59,41 +59,41 @@
   "dependencies": {
     "@expo/vector-icons": "^12.0.0",
     "@react-native-async-storage/async-storage": "~1.15.0",
-    "@react-native-community/datetimepicker": "3.5.2",
+    "@react-native-community/datetimepicker": "4.0.0",
     "@react-native-masked-view/masked-view": "0.2.6",
-    "@react-native-picker/picker": "1.16.1",
+    "@react-native-picker/picker": "2.2.1",
     "@react-navigation/devtools": "6.0.4",
     "@react-navigation/drawer": "5.12.5",
     "@react-navigation/native": "5.9.4",
     "@react-navigation/stack": "5.14.5",
     "apisauce": "2.1.2",
-    "expo": "~42.0.1",
-    "expo-auth-session": "~3.2.3",
-    "expo-constants": "~11.0.1",
-    "expo-linking": "~2.3.1",
-    "expo-random": "~11.1.2",
-    "expo-splash-screen": "~0.11.2",
-    "expo-status-bar": "~1.0.4",
-    "expo-web-browser": "~9.1.0",
+    "expo": "^44.0.0",
+    "expo-auth-session": "~3.5.0",
+    "expo-constants": "~13.0.1",
+    "expo-linking": "~3.0.0",
+    "expo-random": "~12.1.1",
+    "expo-splash-screen": "~0.14.1",
+    "expo-status-bar": "~1.2.0",
+    "expo-web-browser": "~10.1.0",
     "format-json": "1.0.3",
     "formik": "2.2.9",
     "identity-obj-proxy": "3.0.0",
     "lodash": "4.17.21",
     "querystringify": "2.2.0",
     "ramda": "0.27.1",
-    "react": "16.13.1",
+    "react": "17.0.1",
     "react-datepicker": "4.3.0",
-    "react-dom": "16.13.1",
-    "react-native": "https://github.com/expo/react-native/archive/sdk-42.0.0.tar.gz",
-    "react-native-gesture-handler": "~1.10.2",
+    "react-dom": "17.0.1",
+    "react-native": "0.64.3",
+    "react-native-gesture-handler": "~2.1.0",
     "react-native-keyboard-aware-scroll-view": "0.9.4",
     "react-native-modal-datetime-picker": "13.0.0",
     "react-native-picker-select": "8.0.4",
-    "react-native-reanimated": "~2.2.0",
-    "react-native-safe-area-context": "3.2.0",
-    "react-native-screens": "~3.4.0",
+    "react-native-reanimated": "~2.3.1",
+    "react-native-safe-area-context": "3.3.2",
+    "react-native-screens": "~3.10.1",
     "react-native-sectioned-multi-select": "0.8.1",
-    "react-native-web": "^0.14.13",
+    "react-native-web": "0.17.1",
     "react-redux": "7.2.6",
     "redux": "4.1.2",
     "redux-persist": "6.0.0",
@@ -103,14 +103,14 @@
     "yup": "0.32.11"
   },
   "devDependencies": {
-    "@babel/core": "^7.9.0",
-    "@expo/webpack-config": "^0.12.63",
+    "@babel/core": "^7.12.9",
+    "@expo/webpack-config": "~0.16.2",
     "@react-native-community/eslint-config": "3.0.1",
     "@storybook/addons": "5.3.21",
     "@storybook/react-native": "5.3.25",
     "@storybook/theming": "5.3.21",
-    "@types/react": "~16.9.35",
-    "@types/react-native": "~0.63.2",
+    "@types/react": "~17.0.21",
+    "@types/react-native": "~0.64.12",
     "babel-jest": "27.4.2",
     "babel-preset-env": "1.7.0",
     "buffer": "6.0.3",
@@ -121,8 +121,8 @@
     "eslint-plugin-prettier": "4.0.0",
     "expect": "26.6.2",
     "generator-jhipster-react-native": "4.2.5",
-    "jest": "26.6.3",
-    "jest-expo": "^42.0.0",
+    "jest": "^26.6.3",
+    "jest-expo": "^44.0.0",
     "lint-staged": "12.1.2",
     "mockery": "2.1.0",
     "patch-package": "6.4.7",
@@ -132,7 +132,7 @@
     "resolve": "1.20.0",
     "rimraf": "3.0.2",
     "tapable": "2.2.1",
-    "typescript": "4.4.4"
+    "typescript": "~4.3.5"
   },
   "engines": {
     "node": ">=12.x",

ThakurKarthik · 2022-08-31T11:30:15Z

If I open Android Studio and monitor the logs, this is what I see before the error:

2022-08-30 07:27:34.321 708-933/? D/PeopleSpaceWidgetMgr: Sbn doesn't contain valid PeopleTileKey: null/0/host.exp.exponent
2022-08-30 07:27:34.323 3001-21011/? W/NetworkScheduler: Error inserting flex_time=3567000 job_id=-1 period=7136000 source=16 requires_charging=0 preferred_network_type=1 target_class=com.google.android.gms.measurement.PackageMeasurementTaskService user_id=0 target_package=com.google.android.gms tag=Measurement.PackageMeasurementTaskService.UPLOAD_TASK_TAG task_type=0 required_idleness_state=0 service_kind=0 source_version=222615000 persistence_level=1 preferred_charging_state=1 required_network_type=0 runtime=1661866054320 retry_strategy={"maximum_backoff_seconds":{"3600":0},"initial_backoff_seconds":{"30":0},"retry_policy":{"0":0}} last_runtime=0 [CONTEXT service_id=218 ]
    android.database.sqlite.SQLiteConstraintException: UNIQUE constraint failed: pending_ops.tag, pending_ops.target_class, pending_ops.target_package, pending_ops.user_id (code 2067 SQLITE_CONSTRAINT_UNIQUE)
        at android.database.sqlite.SQLiteConnection.nativeExecuteForLastInsertedRowId(Native Method)
        at android.database.sqlite.SQLiteConnection.executeForLastInsertedRowId(SQLiteConnection.java:940)
        at android.database.sqlite.SQLiteSession.executeForLastInsertedRowId(SQLiteSession.java:790)
        at android.database.sqlite.SQLiteStatement.executeInsert(SQLiteStatement.java:89)
        at android.database.sqlite.SQLiteDatabase.insertWithOnConflict(SQLiteDatabase.java:1702)
        at android.database.sqlite.SQLiteDatabase.insertOrThrow(SQLiteDatabase.java:1597)
        at bezs.g(:com.google.android.gms@[email protected] (190800-461192076):52)
        at beyl.n(:com.google.android.gms@[email protected] (190800-461192076):3)
        at beyl.u(:com.google.android.gms@[email protected] (190800-461192076):20)
        at beyl.h(:com.google.android.gms@[email protected] (190800-461192076):3)
        at beuc.run(:com.google.android.gms@[email protected] (190800-461192076):9)
        at xot.c(:com.google.android.gms@[email protected] (190800-461192076):6)
        at xot.run(:com.google.android.gms@[email protected] (190800-461192076):7)
        at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1167)
        at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:641)
        at xty.run(:com.google.android.gms@[email protected] (190800-461192076):0)
        at java.lang.Thread.run(Thread.java:920)
2022-08-30 07:27:34.332 1247-1247/? I/GoogleInputMethodService: GoogleInputMethodService.onFinishInput():3420 
2022-08-30 07:27:34.332 1247-1247/? W/KeyboardViewController: KeyboardViewController.show():477 Requesting to show sub view with id 2131428268(#0x7f0b03ac) when keyboard HEADER view is not ready to show
2022-08-30 07:27:34.332 1247-1247/? I/GoogleInputMethodService: GoogleInputMethodService.onStartInput():2002 
2022-08-30 07:27:34.333 20891-21193/? E/ReactNativeJS: { type: 'dismiss' }

I am not that familiar with the situation but if a clean db command exists, that should be run I guess.

mraible · 2022-08-31T14:57:42Z

I solved that yesterday! https://twitter.com/mraible/status/1564709038813757440

Here's the fix:

https://github.com/mraible/generator-jhipster-react-native/blob/auth0-logout/generators/app/templates/app/modules/login/login.utils.ts.ejs#L78-L79

mraible · 2022-09-02T22:12:59Z

@DanielFran https://opencollective.com/generator-jhipster/expenses/92826

pascalgrimaud · 2022-09-03T06:43:41Z

@mraible : approved

mraible added $$ bug-bounty $$ https://www.jhipster.tech/bug-bounties/ $500 https://www.jhipster.tech/bug-bounties/ labels Jun 9, 2022

mraible mentioned this issue Aug 30, 2022

Fix logout with Auth0 #881

Merged

mraible closed this as completed in #881 Sep 1, 2022

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add support for Auth0 #782

Add support for Auth0 #782

mraible commented Jun 2, 2022

ThakurKarthik commented Aug 27, 2022 •

edited

Loading

mraible commented Aug 27, 2022

mraible commented Aug 27, 2022

ThakurKarthik commented Aug 27, 2022

mraible commented Aug 27, 2022

ThakurKarthik commented Aug 28, 2022

mraible commented Aug 28, 2022

ThakurKarthik commented Aug 28, 2022

mraible commented Aug 28, 2022

mraible commented Aug 30, 2022

mraible commented Aug 30, 2022

ThakurKarthik commented Aug 30, 2022

mraible commented Aug 30, 2022

mraible commented Aug 30, 2022

ThakurKarthik commented Aug 31, 2022

ThakurKarthik commented Aug 31, 2022

mraible commented Aug 31, 2022

mraible commented Sep 2, 2022

pascalgrimaud commented Sep 3, 2022

Add support for Auth0 #782

Add support for Auth0 #782

Comments

mraible commented Jun 2, 2022

ThakurKarthik commented Aug 27, 2022 • edited Loading

mraible commented Aug 27, 2022

mraible commented Aug 27, 2022

ThakurKarthik commented Aug 27, 2022

mraible commented Aug 27, 2022

ThakurKarthik commented Aug 28, 2022

mraible commented Aug 28, 2022

ThakurKarthik commented Aug 28, 2022

mraible commented Aug 28, 2022

mraible commented Aug 30, 2022

mraible commented Aug 30, 2022

ThakurKarthik commented Aug 30, 2022

mraible commented Aug 30, 2022

mraible commented Aug 30, 2022

ThakurKarthik commented Aug 31, 2022

ThakurKarthik commented Aug 31, 2022

mraible commented Aug 31, 2022

mraible commented Sep 2, 2022

pascalgrimaud commented Sep 3, 2022

ThakurKarthik commented Aug 27, 2022 •

edited

Loading