help request: SPA frontend outside of APISIX needs to call api served by APISIX with OIDC authentication

[Chiney973]

Description

All my web application are served under the same domain, except for the IDP

Frontend will be served under http://localhost/app/
Apisix will be served under http://localhost/app/api/
I am using keycloak as an IDP under http://keycloak/

I am having issues authenticating to the apisix gateway with my spa frontend as it is not served by apisix

What I have tried:

• Have my spa sends a fetch request to any api served by apisix gateway. But when I get redirected to the idp for authentication, I am having CORS issues. Keycloak does not handle preflight for http://keycloak:8080/realms/django-realm/protocol/openid-connect/auth
• Have a dummy endpoint (not served by apisix) http://localhost/authenticate that return a http redirection to http://keycloak:8080/realms/django-realm/protocol/openid-connect/auth with state, code challenges, redirect url, etc.. all set up. But after login to the idp, it reaches the apisix server with a 500 error with the following message:
  openid-connect.lua:588: phase_func(): OIDC authentication failed: request to the redirect_uri path but there's no session state found

Could someone plz enlight me on how are we supposed to authenticate with oidc to the apisix gateway with a spa not served by the gateway ?

Environment

• APISIX version (3.11.0):
• Operating system (run uname -a):
• OpenResty / Nginx version (openresty/1.25.3.2 ):
• etcd version, if relevant (standalone mode):
• APISIX Dashboard version, if relevant:
• Plugin runner version, for issues related to plugin runners:
• LuaRocks version, for installation issues (run luarocks --version):