M1 - Implement the new auth system using Keycloak

[teolemon]

Warning

This is a first draft. I'm still trying to understand what we need to do

Overview

Implement the new auth system using Keycloak.

• Theoretically we could do nothing at all.
• I do believe though that we currently rely on some HTML parsing and insecure methods that we could get rid of.
• We will regress in terms of native experience, but potentially progress in maintenability.

Feedback from @alexgarel

Communication

• the mobile app should directly communicate with Keycloak using standard OpenID Connect (OIDC) protocols. OIDC libraries are probably available for Flutter.

For user creation, two options:

• Using a web-view.
• Implementing a native form, potentially by querying the Keycloak API for available fields.

Pointer

link to a potential Flutter library for Keycloak integration: https://github.com/fa-fifi/keycloak_wrapper for evaluation.

Potential steps (wrong steps according to @alexgarel , to be fixed)

• Authentication Flow Redirection:
  • Identify Current Authentication Code: Pinpoint all login and registration UI and logic reside in the mobile app.
  • Implement Redirection to Keycloak
    • When the user taps "Login", the app should open a web browser view directed to the Keycloak authentication URL. Keycloak will handle the login UI (username/password, social logins if configured). (TODO: which is?)
    • When the user taps "Register", the app should open a web browser view directed to the Keycloak registration URL (different from login ??) (TODO: which is?)
    • When the user taps "Display account", the app should open a web browser view directed to the Keycloak account center URL (TODO: which is?)
    • When the user taps "Delete profile" the app should open a web browser view directed to the Keycloak account deletion URL. (TODO: which is?)
  • Handle Callback:
    • Configure Keycloak to redirect back to a custom URI scheme for the mobile app after successful authentication.
      • The mobile app needs to be able to intercept this callback.
      • Extract the authorization code from the callback.
    • Token Exchange:
      The mobile app exchanges the authorization code with the Keycloak token endpoint to get an ID token, access token, and refresh token.
  • Store Tokens Securely: Store tokens securely on the device (e.g., using Keychain on iOS, Keystore on Android).
    • TODO: select proper flutter lib
  • Attach Tokens to API Requests: Modify network request logic to include the access token in the Authorization header for authenticated API calls to the Open Food Facts backend.
    • TODO: Dart package update
    • TODO: Bump version in mobile app and use it
• Logout Functionality:
  • Implement logout by:
    • Clearing local tokens.
    • Optionally, redirecting to Keycloak's end session endpoint to clear the Keycloak session.
• Testing on world.test.openpetfoodfacts.org
  • Verify Login on Android: Can users log in using credentials that exist/are created in Keycloak?
  • Verify Login on iOS: Can users log in using credentials that exist/are created in Keycloak?
  • Verify Registration on Android: If Keycloak handles registration, test this flow.
  • Verify Registration on iOS: If Keycloak handles registration, test this flow.
  • Verify Authenticated Actions on Android: Test core app functionalities that require authentication (e.g.,
    • editing products
    • user profile viewing
  • Verify Authenticated Actions on iOS: Test core app functionalities that require authentication
    • editing products
    • user profile viewing
  • Verify Logout on Android
  • Verify Logout on iOS

[teolemon]

@monsieurtanuki would you be interested by this topic ? It would require close coordination with @john-gom (and my understanding of it is limited)

[monsieurtanuki]

@teolemon 1. Not interested at all, and 2. zero understanding about it anyway (which partly explains 1.)