実現したいこと
Next.jsにてAuth.js（旧Next-Auth）をを使用して、GoogleのOAuthを組み込みたい
発生している問題・分からないこと
以下のエラーが面が表示された。
エラーメッセージ
error
1アクセスをブロック: 認証エラーです 2The OAuth client was not found. 3このアプリのデベロッパーの場合は、エラーの詳細をご確認ください。 4エラー 401: invalid_client
該当のソースコード
特になし
試したこと・調べたこと
- teratailやGoogle等で検索した
- ソースコードを自分なりに変更した
- 知人に聞いた
- その他
上記の詳細・結果
Next.jsを新たに立ち上げ（６月２０日時点で最新のバージョン、app router使用）、Auth.jsはbeta版をインストールしました。beta版については、公式サイトにてバージョン４からbeta版となったときに破壊的変更が行われたために、特段の理由がない場合はbeta版を推奨していたためです。
そこから、Next.js、Auth.jsの公式サイトに従い、トップページの真ん中にGoogleサインインのボタンを配置するだけのページを作成しました。
中心に”Signin with Google”とあるだけのページ
google cloudでは、以下のように設定を行いました。
（一部ID等を隠しております。）
ディレクトリ構成やファイルは以下のように、公式ページそのままなはずです。
google chrome, microsoft edge, firefoxの3つのブラウザーで、拡張機能を切った状態でも発生しました。
追記
GitHubのOAuth認証の設定も行ってみたところ、Chrome、Edgeでは以下の画面が表示されました。
その一方で、FirefoxとBraveブラウザーでは、以下の画面が表示されました。
しかし、FirefoxとBraveでGithubからサインインを行おうとすると、Chrome、Edgeの時と同様の404エラーが表示されました。
GithubのDeveloper Settingを見てみると、以下のようにキーが”Never Used”となっていましたので、Auth.js側から呼び出されていないようです。
Auth.jsのバグのようにも感じられます。
0 コメント