如何在react应用程序中使用okta刷新标记

npm install @okta/okta-react

import { OktaAuth } from '@okta/okta-auth-js';

const oktaConfig = {
  clientId: 'YOUR_CLIENT_ID',
  issuer: 'https://YOUR_OKTA_DOMAIN/oauth2/default',
  redirectUri: window.location.origin + '/implicit/callback',
  scopes: ['openid', 'profile', 'email'],
  pkce: true
};

const oktaAuth = new OktaAuth(oktaConfig);

export default oktaAuth;

import { Security } from '@okta/okta-react';
import oktaAuth from './oktaConfig';

ReactDOM.render(
  <Security oktaAuth={oktaAuth}>
    <App />
  </Security>,
  document.getElementById('root')
);

import { useOktaAuth } from '@okta/okta-react';

const MyComponent = () => {
  const { authState, authService } = useOktaAuth();

  if (authState.isPending) {
    return <div>Loading...</div>;
  }

  if (!authState.isAuthenticated) {
    return <button onClick={() => authService.login()}>Login</button>;
  }

  return (
    <div>
      <p>Welcome, {authState.idToken.claims.email}!</p>
      <button onClick={() => authService.logout()}>Logout</button>
    </div>
  );
};