AxaFrance / oidc-client

Light, Secure, Pure Javascript OIDC (Open ID Connect) Client. We provide also a REACT wrapper (compatible NextJS, etc.).
MIT License
572 stars 151 forks source link

No documentation how to refresh access token when not using service worker #1263

Open Mikilll94 opened 5 months ago

Mikilll94 commented 5 months ago

Issue and Steps to Reproduce

It's not clear how to refresh access token when not using service worker. It's not documented anywhere.

When using service worker it's simple because refreshing the token is done automatically in the background.

Versions

7.3.15

Screenshots

Expected

There should be some documentation how to use refresh token to prolong the user session.

Actual

No documentation how to use refresh tokens.

Additional Details

guillaume-chervet commented 5 months ago

Hi @Mikilll94 , The behavior is exactly the same whithout service worker. Tokens are refreshed automaticaly by the library if it is possible. The library expose also an overrided fetch function which allow to wait for a valid tokens to be valid before playing the fetch (for some edge cases).

Mikilll94 commented 5 months ago

@guillaume-chervet Thanks, for the info :)

About this overriden fetch -> do i have to use it for all requests when not using service worker? I have noticed that service worker adds Authorization header for all requests. How can i have the same behavior without using service worker?

Also from what i saw in the docs this overriden fetch is a hook. How can i use it outside react components?

Thanks again :) Have a nice day 😄

guillaume-chervet commented 5 months ago

Hi @Mikilll94 , the given fetch is not mandatory. Yes it add automatically authorization headers.

You can use it outside of react application by importing @axa-fr/oidc-client used under the hood by the react library. If you use the same configuration name it will use share the same context and you can import the same fetch outside of react.

Mikilll94 commented 5 months ago

@guillaume-chervet Could you give an example in code how to do it? The docs are showing only useOidcFetch hook.

bhargavmullakuru commented 5 months ago

Hi @Mikilll94,

Check the below one, I think it helps you.

const { fetch } = useOidcFetch();

use the above fetch as normal js fetch, it will add headers automatically.

abhilashlr7 commented 2 months ago

How do we go about for Axios setup when we don't use the Fetch hook?

guillaume-chervet commented 2 months ago

Hi @abhilashlr7 ,

You can be able tobuse the method explained here https://github.com/AxaFrance/oidc-client/issues/1347