gistfile1.txt

import React, { Component } from 'react';
import './App.css';

const axios = require('axios')

const domain = 'MY-DOMAIN'
const audience = 'MY-API-AUDIENCE'
const client_id = 'MY-CLIENT-ID'
const redirect_uri = 'http://localhost:3000' //This application will run on localhost

let crypto;
try {
  crypto = require('crypto');
} catch (err) {
  console.log('crypto support is disabled!');
}
function base64URLEncode(str) {
  return str.toString('base64')
    .replace(/\+/g, '-')
    .replace(/\//g, '_')
    .replace(/=/g, '');
}
var verifier = base64URLEncode(crypto.randomBytes(32));

axios.interceptors.response.use(response => {
  return response;
}, error => {
  console.log("AXIOS Error", error);
  return error.response;
});

function sha256(buffer) {
  return crypto.createHash('sha256').update(buffer).digest();
}
var challenge = base64URLEncode(sha256(verifier));

class App extends Component {

  componentDidMount() {
    this.runAxios();
  }
  async runAxios(data) {
    try {

      var urlParams = new URLSearchParams(window.location.search);
      let code = urlParams.get('code')
      console.log("code", code);

      if (code !== undefined && code !== null) {

        let config = {
          headers: {
            'Content-Type': 'application/json',
          }
        }

        let data = {
          "grant_type": "authorization_code",
          "client_id": client_id,
          "code_verifier": verifier,
          "code": code,
          "redirect_uri": "http://localhost:3000"
        }

        let URL = domain + '/oauth/token'

        console.log("making oauth/token call", URL, data, config);

        let result = await axios.post(URL, data, config);
        
        //THIS IS THE RESPONSE THAT RETURNS UNAUTHORIZED
        console.log("oath call result", JSON.stringify(result));
      }
      else {
        console.log("no code, skipping token call")
      }
    }
    catch (error) {

    }
  }

  render() {

    let signin_href = `${domain}/authorize?scope=profile&audience=${audience}&response_type=code&client_id=${client_id}&code_challenge=${challenge}&code_challenge_method=S256&redirect_uri=${redirect_uri}`
    console.log("signin_href", signin_href);

    return (
      <div className="App">
        <header className="App-header">
          <a href={signin_href}>
            Sign In
          </a>
        </header>
      </div>
    );
  }
}

export default App;