こちらは、Mavs Advent Calendar2023の11日目の記事です!🧦 ハコザキです。 WEBシステム開発において、ログインが必須な管理画面を実装する際、 管理者しかアクセスさせたくない!など 複数の権限でのページアクセスの制御を実装する機会があると思います。 今回はNuxt3で各機能を活用し、実装してみましたので ぜひ参考にしていただければと思います..! 記事が長くなってしまったので 前編として簡単なログイン機能の実装(本記事)、 後編にアクセス制御のミドルウェアの実装などを行います。 はじめに 今回はこちらの記事を一部参考にし、Nuxt3の書き方で実装してみました。 非常にわかりやすかったのでぜひ一読していただきたいです..! Nuxt.jsで権限管理 今回のログイン認証&権限によるページ制御の実装デモ 権限がないページへアクセスできなくなる 権限がある場合ページにアク
![【Nuxt3】権限ごとのページアクセスの制御について(ログイン機能編)](https://cdn-ak-scissors.b.st-hatena.com/image/square/52f85c3911c9265fab7fbd2dcfa8749d0c0a524d/height=288;version=1;width=512/https%3A%2F%2Fmavs-wp-media-server.s3.ap-northeast-1.amazonaws.com%2F2023%2F12%2F11165515%2Fthumbnail-4.png)