Understanding refresh tokens and backend authentication

I feel like I’m not completely understanding refresh tokens, and wanted to post just to make sure I’m on the right track.

I have an SPA that is a form for my users to fill out. I’m using okta-vue, and I verify access tokens on the backend via the /introspect endpoint before proceeding. However, I’m having an issue where the frontend will auto-refresh after an hour when a new access_token is needed, which is terrible for the user experience.

I’m assuming refresh_tokens are the solution based on what I’ve read, and I think I’ve implemented them correctly. I have “Refresh tokens” added as a grant type in Okta Admin, and offline_access added as a scope on my frontend.

  • Since okta-vue (and okta-auth-js, by extension) are handling calls to /authorize and /token automatically, is there anything I need to do to make refresh tokens work beyond what I’ve already set up? (I additionally have autoRenew set under services, and have the service set to start(), but is that actually necessary?)
  • At first, I thought I needed to send the refresh_token to the /introspect endpoint instead of the access_token, but is the refresh_token essentially always refreshing the access_token, making that unnecessary? I.e., one token refreshing the other means the access_token will always be valid to /introspect as long as the user’s logged in?
  • Is using /introspect off of the refresh_token technically less secure, because the token is much shorter and therefore easier to crack?