メール認証方式のユーザ登録機能を実装する〜Reactjs + Django 環境｜macOS〜

ユーザ認証を設定します。

※ 以下は reactjs-auth-django-rest をベースにしています。

Django アプリ user_profile を作成します。( アプリ名は任意 )

(backend) try🐶everything backend$ django-admin startapp user_profile
(backend) try🐶everything backend$ cd user_profile/

user_profile/adapter.py を作成します。( 新 )

from django.contrib.sites.shortcuts import get_current_site
from allauth.account.adapter import DefaultAccountAdapter

class MyAccountAdapter(DefaultAccountAdapter):
    def get_email_confirmation_url(self, request, emailconfirmation):
        current_site = get_current_site(request)
        return '{}/account/confirm-email/{}/'.format(current_site, emailconfirmation.key)

user_profile/views.py を編集します。

# permissions
from rest_framework.decorators import permission_classes
from rest_framework import permissions
from rest_framework.permissions import IsAuthenticated

from django.contrib.auth import get_user_model
User = get_user_model()

from rest_framework.decorators import action
from rest_framework import viewsets
from rest_framework.generics import get_object_or_404
from rest_framework.response import Response
from rest_framework import status, viewsets

from users.serializers import UserSerializer

class UserViewSet(viewsets.ReadOnlyModelViewSet):
    """
    This viewset automatically provides `list` and `detail` actions.
    """
    queryset = User.objects.all().order_by('id')
    serializer_class = UserSerializer
    permission_classes = (IsAuthenticated, )

    @action(detail=False) # retrieve current_user
    def me(self, request, *args, **kwargs):
        serializer_context = {
            'request': request,
        }
        user = get_object_or_404(User, id=request.user.id)
        return Response(UserSerializer(request.user, context=serializer_context).data,
                        status=status.HTTP_200_OK)

PostgreSQL を設定します。

データベースをデフォルトの sqlite3 の代わりに、PostgreSQL を使用します。
( sqllite3 を使用する場合はスキップしてください。)

PostgreSQLを設置するには、下記のコマンドでインストールできます。

brew install postgresql

sqlite3 をコメントアウトし、PostgreSQL 設定を追加します。
( 最初に project/settings.py を編集しましたので、下記は参考までに。)

(backend) try🐶everything backend$ vi project/settings.py

# DATABASES = {
#    'default': {
#        'ENGINE': 'django.db.backends.sqlite3',
#        'NAME': os.path.join(BASE_DIR, 'db.sqlite3'),
#    }
# }

DATABASES = {
    'default': {
        'ENGINE': 'django.db.backends.postgresql',
        'NAME': 'database名',
        'USER': 'ユーザ名',
        'PASSWORD': 'ユーザパスワード',
        'HOST': 'localhost',
        'PORT': '',
    }
}

データベースとユーザを作成します。

コマンド：CREATE DATABASE database名 OWNER ユーザ名;
コマンド：CREATE USER ユーザ名 ‘ユーザパスワード;

(backend) try🐶everything backend$ psql postgres
psql (11.3)
Type "help" for help.

postgres=# CREATE DATABASE database名 OWNER ユーザ名;
CREATE DATABASE
postgres=#
postgres=# CREATE USER ユーザ名 'ユーザパスワード;
postgres'#
postgres=# SELECT * FROM pg_user;
   usename   | usesysid | usecreatedb | usesuper | userepl | usebypassrls |  passwd  | valuntil | useconfig
-------------+----------+-------------+----------+---------+--------------+----------+----------+-----------
 macadmin |       10 | t           | t        | t       | t            | ******** |          |
 ユーザ名   |    16960 | f           | f        | f       | f            | ******** |          |
(3 rows)

postgres=# \l
                                      List of databases
   Name    |    Owner    | Encoding |   Collate   |    Ctype    |      Access privileges
-----------+-------------+----------+-------------+-------------+-----------------------------
 postgres  | macadmin | UTF8     | en_US.UTF-8 | en_US.UTF-8 |
 database名  | ユーザ名   | UTF8     | en_US.UTF-8 | en_US.UTF-8 |
 template0 | macadmin | UTF8     | en_US.UTF-8 | en_US.UTF-8 | =c/macadmin             +
           |             |          |             |             | macadmin=CTc/macadmin
 template1 | macadmin | UTF8     | en_US.UTF-8 | en_US.UTF-8 | =c/macadmin             +
           |             |          |             |             | macadmin=CTc/macadmin
(4 rows)

追加した内容をマイグレーションし、データベースに反映します。

コマンド：python manage.py makemigrations users

(backend) try🐶everything backend$ python manage.py makemigrations users
Migrations for 'users':
  users/migrations/0001_initial.py
    - Create model CustomUser
(backend) try🐶everything backend$ 

コマンド：python manage.py migrate

(backend) try🐶everything backend$ python manage.py migrate
Operations to perform:
  Apply all migrations: account, admin, auth, authtoken, contenttypes, sessions, sites, socialaccount, users
Running migrations:
  Applying authtoken.0001_initial... OK
  Applying authtoken.0002_auto_20160226_1747... OK
  Applying socialaccount.0001_initial... OK
  Applying socialaccount.0002_token_max_lengths... OK
  Applying socialaccount.0003_extra_data_default_dict... OK
(backend) try🐶everything backend$

Superuser を作成します。

デフォルトのユーザ登録の場合： Username / Email / Password ( 参考のみ )

↓↓↓

今回修正したユーザ登録方法：Email / Password

全て問題なければ、Django 開発サーバ を起動します。

(backend) try🐶everything backend$ python manage.py runserver
Watching for file changes with StatReloader
Performing system checks...

System check identified no issues (0 silenced).
October 07, 2019 - 19:37:20
Django version 2.2, using settings 'project.settings'
Starting development server at http://127.0.0.1:8000/
Quit the server with CONTROL-C.

http://127.0.0.1:8000/api/ にアクセスして API サイトを確認します。

http://127.0.0.1:8000/admin にもアクセスしてみてください。

この時点ではフロンドエンド側のユーザ登録フォームの実装やユーザ認証設定ができていませんので、ユーザの登録 ( 追加 ) は Django admin で直接追加するしかありません。

次は、フロントエンド側を設定します。