Strapiでユーザー登録を実装する

Nuxt.jsを使って、Strapiのユーザー登録をサイト上から行う処理を試してみます。

サンプルコード

左メニューの 設定 > Advanced Settings を選択して、認証されたユーザーのデフォルトの役割を変更します。
今回は以前の記事で追加したReaderにして保存します。

サイト上からユーザーを登録する場合、「/auth/local/register」にusername、email、passwordをpostすればOKです。

<template>
  <h1>Hello world</h1>
</template>
<script>
  export default {
    async asyncData({ $axios }) {
      // ユーザー登録
      const register = await $axios.$post('http://localhost:1337/auth/local/register', {
        username: 'test',
        email: 'test@example.com',
        password: 'password12345'
      });
      console.log('register', register);
    }
  }
</script>

username、email、passwordの値はダミーを入れているので、適宜変更してください。
上記登録後のレスポンスは以下のようになっています。(一部改変しています。)

{
  jwt: 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6MSwiaWF0IjoxNTc2OTM4MTUwLCJleHAiOjE1Nzk1MzAxNTB9.UgsjjXkAZ-anD257BF7y1hbjuY3ogNceKfTAQtzDEsU',
  user: {
    id: 2,
    username: 'test',
    email: 'test@example.com',
    provider: 'local',
    confirmed: true,
    blocked: null,
    role: {
      id: 3,
      name: 'Reader',
      description: 'Reader role',
      type: 'reader'
    },
    created_at: 'XXXXXXXX',
    updated_at: 'XXXXXXXX'
  }
}

管理画面のユーザーから確認すると、追加したユーザーを確認することができました。