Auth0のReact sampleが動かない問題の対処方法

Auth0の公式React quickstartは自分の環境では動かなかった

サンプルでログインするとUnauthorizedになる

サンプルアプリを動かすと、ログイン後、Unauthorizedになるが、これはAuth0の設定画面でAuthentication Methodsが Client Secret (Post) になっているからだった

これをNoneにすればUnauthorizedが出ずに動く

原因を探ると、認証サーバーの /oauth/token エンドポイントにaccess tokenを取得しに行ったときに、client secretを一緒にpostしないといけないらしい

External APIページで Ping APIを押すと401になる

External APIページで Ping APIを押すと、401になって返ってこない。
サンプルAPIサーバーのコンソールを見ると、InvalidTokenError: Invalid Compact JWS auth0 と言われている。

これはクライントsdkの authorizationParamsにaudienceを入れていないからになる。

ので以下のように追加で解決

index.js

root.render(
  <Auth0Provider
    {...config}
    authorizationParams= {{
      redirect_uri: window.location.origin,
+     audience: config.audience
    }}
  >