@bity/oauth2-auth-code-pkce/tests/panel.html

An OAuth 2.0 client that ONLY supports Authorization Code flow with PKCE support.

<!-- authorize() defined just below. -->
<button onclick="authorize()">Authorize</button>

<!-- Includes the OAuth client. -->
<script src="../index.umd.js"></script>
<script>
const { OAuth2AuthCodePKCE } = window.OAuth2AuthCodePKCE;

// This is just an example using our infrastructure. This was developed against
// ORY Hydra, if that help to know. You will need to change the values to
// something you have access to.
const oauth = new OAuth2AuthCodePKCE({
  extraAuthorizationParams: {
    'test': '1',
    'hello': 'world'
  },
  authorizationUrl: 'https://connect.bity.io/oauth2/auth',
  tokenUrl: 'https://connect.bity.io/oauth2/token',
  clientId: '5e510f25-9c41-407b-8fe0-3825f7445b92',
  scopes: ['https://auth.bity.io/scopes/bookmarks.manage'],
  redirectUrl: 'http://localhost:8000/return',
  onAccessTokenExpiry(refreshAccessToken) {
    console.log("Expired! Access token needs to be renewed.");
    alert("We will try to get a new access token via grant code or refresh token.");
    return refreshAccessToken();
  },
  onInvalidGrant(refreshAuthCodeOrRefreshToken) {
    console.log("Expired! Auth code or refresh token needs to be renewed.");
    alert("Redirecting to auth server to obtain a new auth grant code.");
    //return refreshAuthCodeOrRefreshToken();
  }
});

function authorize() { oauth.fetchAuthorizationCode(); }

oauth.isReturningFromAuthServer().then(hasAuthCode => {
  if (!hasAuthCode) { console.log("Something wrong...no auth code."); }
  return oauth.getAccessToken().then((token) => console.log(token));
})
.catch((potentialError) => {
  if (potentialError) { console.log(potentialError); }
});
</script>