【Rails・Next.js】devise-token-authによるログイン認証 Part3

# はじめに
【Rails・Next.js】devise-token-authによるログイン認証のPart3です。
Part2はこちらです。

https://qiita.com/ke_sukesakuma/items/043d5270db608c433e5b

# ユーザ新規作成APIの動作確認

- **メソッド**: `POST`
- **URL**: `http://localhost:3000/api/v1/auth`
- **HEADERS**: `Content-Type: application/json`
```json:Body
{
  "email": "test2@example.com",
  "password":"password",
  "confirm_success_url": "http://localhost:8000"
}
```

![スクリーンショット 2023-12-15 16.50.24.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2517817/6bd93de0-491c-b09b-987a-e87c7e685334.png)


200 OK がレスポンスとして返ってくること=ユーザーが新規作成できたことを確認してください。

一方、現状メール認証での確認ができておらず、confirmd_atがnilになっています。

```ruby
  create_table "users", charset: "utf8mb4", collation: "utf8mb4_0900_ai_ci", force: :cascade do |t|
    t.string "provider", default: "email", null: false
    t.string "uid", default: "", null: false
    t.string "encrypted_password", default: "", null: false
    t.string "reset_password_token"
    t.datetime "reset_password_sent_at"
    t.boolean "allow_password_change", default: false
    t.datetime "remember_created_at"
    t.string "confirmation_token"
    t.datetime "confirmed_at"
    t.datetime "confirmation_sent_at"
    t.string "unconfirmed_email"
    t.string "name"
    t.string "nickname"
    t.string "image"
    t.string "email"
    t.text "tokens"
    t.datetime "created_at", null: false
    t.datetime "updated_at", null: false
    t.index ["confirmation_token"], name: "index_users_on_confirmation_token", unique: true
    t.index ["email"], name: "index_users_on_email", unique: true
    t.index ["reset_password_token"], name: "index_users_on_reset_password_token", unique: true
    t.index ["uid", "provider"], name: "index_users_on_uid_and_provider", unique: true
  end
```

```ruby
[5] pry(main)> User.find(2).confirmed_at
  User Load (1.0ms)  SELECT `users`.* FROM `users` WHERE `users`.`id` = 2 LIMIT 1
=> nil
[6] pry(main)> 
```

`http://localhost:3000/letter_opener` に認証用のメールが送信されているので、アカウントを有効化にします。

![スクリーンショット 2023-12-15 17.13.48.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2517817/de4f1d31-3dcc-f622-fe13-622f70c40b46.png)


この手続きにより、`新規登録`、`メール認証`が完了したので次にログインAPIを動作確認します。


# ログインAPIの動作確認

- **メソッド**: `POST`
- **URL**: `http://localhost:3000/api/v1/auth/sign_in`
- **HEADERS**: `Content-Type: application/json`
```json:Body
{
  "email": "test2@example.com",
  "password":"password"
}
```


![スクリーンショット 2023-12-15 17.17.44.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2517817/127ad5b0-0ef3-d70a-2ccd-48cc9ee3e388.png)

レスポンスに`access-token`,`client`,`uid`が含まれています。
`Next`側を実装する際に、これらの情報でログインユーザがどうかを判定していきます。


![スクリーンショット 2023-12-15 17.24.14.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2517817/76905426-5506-cc6f-7a25-d7fb073086d9.png)


# ログインユーザ取得用アクションの実装

```ruby:app/controllers/api/v1/base_controller.rb
class Api::V1::BaseController < ApplicationController
  alias_method :current_user, :current_api_v1_user
  alias_method :authenticate_user!, :authenticate_api_v1_user!
  alias_method :user_signed_in?, :api_v1_user_signed_in?
end
```

`current_user`、`authenticate_user!`,`user_signed_in?`がdeviseから提供されています。

これらのメソッド名で参照できるのは`controllers`配下であり、`api/v1/xxxx_controller`の場合、`current_api_v1_user`というメソッド名で参照する必要があり、可読性が悪くなるためエイリアスを設定します。

ルーティングを追加します。

```ruby:config/routes.rb
Rails.application.routes.draw do
  mount LetterOpenerWeb::Engine, at: "/letter_opener" if Rails.env.development?
  namespace :api do
    namespace :v1 do
      get "health_check", to: "health_check#index"
      mount_devise_token_auth_for "User", at: "auth"

      namespace :current do
        resource :user, only: [:show] #追加
      end
    end
  end
end
```

レスポンスボディを制御したいため、シリアライザーを導入します。

https://github.com/rails-api/active_model_serializers


```ruby:Gemfile
gem "active_model_serializers"
```

```ruby
rails g serializer current_user
```

```ruby:app/serializers/current_user_serializer.rb
class CurrentUserSerializer < ActiveModel::Serializer
  attributes :id, :name, :email
end
```

コントローラを作成します。

```ruby
rails g controller api/v1/current/users_controller
```

```ruby:app/controllers/api/v1/current/users_controller.rb
class Api::V1::Current::UsersController < Api::V1::BaseController
  before_action :authenticate_user!

  def show
    render json: current_user, serializer: CurrentUserSerializer
  end
end
```

# ログインユーザ取得用APIの動作確認

- **メソッド**: `GET`
- **URL**: `http://localhost:3000/api/v1/current/user`
- **HEADERS**: 以下参照
```yml:HEADERS
access-token: ログインAPIで取得できた値
client: ログインAPIで取得できた値
uid: ログインAPIで取得できた値
```

![スクリーンショット 2023-12-15 18.04.16.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2517817/bfaa3367-02d5-bd53-c4ad-8107cf4c5f8a.png)

正常にレスポンスが確認でき、`id`、`name`、`email`のみデータが返ってきていれば実装完了です。