Giter Site home page Giter Site logo

Comments (5)

anfreita avatar anfreita commented on August 13, 2024 1

Thanks for the explanation @soofstad, that makes a lot of sense. Unfortunately we don't have control over the IdP settings for this application and the group in control has claimed that it's not possible to send expires_in. Using exp as an additional fallback sounds like a good idea to me. I'll try to put together a PR for this

from react-oauth2-pkce.

soofstad avatar soofstad commented on August 13, 2024 1

The standard way of contributing on Github would be to make a fork of the repository tied to your account, make the changes there, and create a pull-request into this repository from that.

If you don't want to go through all that, I can make the changes you suggested myself. Let me know 🙂

from react-oauth2-pkce.

soofstad avatar soofstad commented on August 13, 2024

Hi @anfreita
Thats a good observation. The main reason we don't use the exp claim, is that this library is not OpenID exclusively, but also supports OAuth2, where tokens are not necessarily json (JWT).

Most IdPs should really be setting expires_in in their response, but you are right in that we can try to use exp as an additional fallback if the token is a JWT.

I can try and add that whenever I get some time, or perhaps you want to look into it?

from react-oauth2-pkce.

anfreita avatar anfreita commented on August 13, 2024

@soofstad I've got a change for this and tested locally with our IdP (is there a preferred way of testing with others?), however I don't have access to push the branch here to create a PR. I'll include the diff below if you prefer to go that route. Please let me know next steps and how I can be most helpful.

diff --git a/src/AuthContext.tsx b/src/AuthContext.tsx
index d1f445d..61e6102 100644
--- a/src/AuthContext.tsx
+++ b/src/AuthContext.tsx
@@ -12,7 +12,13 @@ import { createInternalConfig } from './authConfig'
 import { fetchTokens, fetchWithRefreshToken, redirectToLogin, redirectToLogout, validateState } from './authentication'
 import { decodeJWT } from './decodeJWT'
 import { FetchError } from './errors'
-import { FALLBACK_EXPIRE_TIME, epochAtSecondsFromNow, epochTimeIsPast, getRefreshExpiresIn } from './timeUtils'
+import {
+  FALLBACK_EXPIRE_TIME,
+  epochAtSecondsFromNow,
+  epochTimeIsPast,
+  getExpiresInFromJWTToken,
+  getRefreshExpiresIn
+} from './timeUtils'
 
 export const AuthContext = createContext<IAuthContext>({
   token: '',
@@ -96,7 +102,10 @@ export const AuthProvider = ({ authConfig, children }: IAuthProvider) => {
   function handleTokenResponse(response: TTokenResponse) {
     setToken(response.access_token)
     setRefreshToken(response.refresh_token)
-    const tokenExpiresIn = config.tokenExpiresIn ?? response.expires_in ?? FALLBACK_EXPIRE_TIME
+    const tokenExpiresIn = config.tokenExpiresIn
+      ?? response.expires_in
+      ?? getExpiresInFromJWTToken(response.id_token)
+      ?? FALLBACK_EXPIRE_TIME
     setTokenExpire(epochAtSecondsFromNow(tokenExpiresIn))
     const refreshTokenExpiresIn = config.refreshTokenExpiresIn ?? getRefreshExpiresIn(tokenExpiresIn, response)
     setRefreshTokenExpire(epochAtSecondsFromNow(refreshTokenExpiresIn))
diff --git a/src/timeUtils.ts b/src/timeUtils.ts
index ce8ed6f..57db942 100644
--- a/src/timeUtils.ts
+++ b/src/timeUtils.ts
@@ -1,4 +1,5 @@
 import { TTokenResponse } from './Types'
+import { decodeJWT } from './decodeJWT'
 export const FALLBACK_EXPIRE_TIME = 600 // 10minutes
 
 // Returns epoch time (in seconds) for when the token will expire
@@ -30,3 +31,15 @@ export function getRefreshExpiresIn(tokenExpiresIn: number, response: TTokenResp
   // The token response had no refresh_token. Set refresh_expire equals to access_token expire
   return tokenExpiresIn
 }
+
+export function getExpiresInFromJWTToken(idToken: string | undefined): number | undefined {
+  if (idToken) {
+    try {
+      const decodedToken = decodeJWT(idToken)
+      return Math.round(Number(decodedToken.exp) - Date.now() / 1000)
+    } catch (error) {
+      // idToken was not a JWT
+      return
+    }
+  }
+}

from react-oauth2-pkce.

soofstad avatar soofstad commented on August 13, 2024

closed by #136

from react-oauth2-pkce.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.