[feature] Routing frontend URLs with `#` doesn't work smoothly with OAuth.

[Sidebook]

Feature Area

/area frontend

What feature would you like to see?

Pipeline frontend routing is done without # i.e. hash routing

What is the use case or pain point?

Currently, the Kubeflow pipeline frontend adopts hash routing like the below URL: https://{kubeflowHost}/_/pipeline/#/runs/details/{runId}

I'm using Kubeflow Pipeline with an OAuth provider for authentication, but hash routing doesn't work smoothly under that setup. When authentication is required, routing information will disappear because URL fragments won't be sent to the server side. I need to open the URL twice to avoid losing routing from authentication.

This is not a problem specific to the provider we're using. The OAuth spec says the URL must not contain fragments:

https://datatracker.ietf.org/doc/html/rfc6749#section-3.1.2

The endpoint URI MUST NOT include a fragment component.

Some providers have a browser-side implementation to avoid this issue (usually it's done via local storage or cookies). But it's not guaranteed that all providers have that as the official spec doesn't allow fragments.

In addition to that,

https://github.com/kubeflow/pipelines/blob/9cb5913d4757132e2c6e5f1c5fa2cdb7ad541f97/frontend/src/index.tsx#L62

If I read the above code correctly, it's using <HashRouter> but it's not recommended to use as long as there is a strong reason:

https://reactrouter.com/en/main/router-components/hash-router

We strongly recommend you do not use HashRouter unless you absolutely have to.

Is there a workaround currently?

Open the URL twice when authentication is required

---

Love this idea? Give it a 👍.

[github-actions[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[github-actions[bot]]

This issue has been automatically closed because it has not had recent activity. Please comment "/reopen" to reopen it.