本記事は、Ashutosh Panda氏による「Google Login with Django & React --- Part 1」(2021年4月23日公開)の和訳を、著者の許可を得て掲載しているものです。
■シリーズ内容
【前編】Google Developer ConsoleからクライアントIDとクライアントシークレットを取得する
【中編】Django Rest Frameworkバックエンドを作成する
【後編】Reactアプリを作成する
#Google Developer ConsoleからクライアントIDとクライアントシークレットを取得する
ReactとDjango Rest FrameworkでGoogle Oauth 2.0を使う方法を確認してみよう。
ソースコード:https://github.com/aashutoshPanda/google-oauth-django-react
##ステップ1:https://console.cloud.google.com/で新しいプロジェクトを作成する
「プロジェクトを作成」をクリックして、新しいプロジェクトを作成する。
「作成」をクリックして、プロジェクトを作成する。
##ステップ2:OAuth画面を設定する
「認証情報を作成」をクリックし、「OAuthクライアントID」を選択します。次の画面で「同意画面を構成」をクリックします。
「同意画面を構成」をクリックする。
「作成」をクリックする。
次の画面でアプリケーション名(例:OAuth Demo)、サポートメール、デベロッパーの連絡先情報を入力し、他の項目は空のままにします。それ以降の画面では、他の項目は何も変更しません。
##ステップ3:クライアントIDとクライアントシークレットを作成する
ダッシュボードで「認証情報を作成」をクリックし、「OAuthクライアントID」を選択します。以下の項目を選択/入力します。
- アプリケーションの種類:ウェブアプリケーション
- 名前:Oauth Demo
- 承認済みのリダイレクトURI:http://localhost:3000
注:localhost:3000の後に「/」はつけません。
##ステップ4:クライアントIDとクライアントシークレットをどこかにコピーする
クライアントIDとクライアントシークレットをコピーする。
これで「前編」は終わりです。
この記事が少しでもお役に立てれば嬉しいです✌️
##翻訳協力
この記事は以下の方々のご協力により公開する事ができました。改めて感謝致します。
Original Author: Ashutosh Panda
Original Article: Google Login with Django & React --- Part 1
Thank you for letting us share your knowledge!
選定担当: @gracen
翻訳担当: @gracen
監査担当: -
公開担当: @gracen
##ご意見・ご感想をお待ちしております
今回の記事はいかがでしたか?
・こういう記事が読みたい
・こういうところが良かった
・こうした方が良いのではないか
などなど、率直なご意見を募集しております。
頂いたお声は、今後の記事の質向上に役立たせて頂きますので、お気軽に
コメント欄にてご投稿ください。Twitterでもご意見を受け付けております。
皆様のメッセージをお待ちしております。