Java Spring FrameworkとAuth0を組み合わせてユーザ認証を行う

はじめに

Webアプリケーションを作る目的として、ユーザを限定するためにユーザ認証の仕組みを取り入れる必要があります。

独自で作成することもできますが、簡単に、しかし強力な機能を持ち合わせたサービスを使うのも1つの選択肢となり得ます。

ユーザ認証の機構としてはFirebaseやAWS Cognitoなどもありますが、今回の記事ではAuth0というサービスを使ってみようと思います。

やること

  • Spring FrameworkのプロジェクトにAuth0でユーザ認証の仕組みを取り入れる
  • ローカル環境(localhost)においてユーザ認証を行い、プロジェクトの画面をブラウザに表示させる

Auth0とは?

Auth0(読み方:オースゼロ)は、

Auth0は誰でも簡単に導入できる認証・認可プラットフォーム

https://auth0.com/jp

です。

ユーザ認証にはEmail / Password という標準のものから、Googleアカウント、Facebookアカウントなどのソーシャルネットワーキングサイトのアカウント連携で行うもの、またSMSやEmailを介して認証を行うワンタイムコードの方式が可能です。

さまざまなアプリケーションとの連携が可能で、Auth0公式が提供するサンプルコードも充実しています。

公式ページはこちら: https://auth0.com/jp

本記事を読み進めるための前提

  • Spring Frameworkのプロジェクトがある
  • Auth0のアカウントがある

1. Auth0アプリケーションをセッティングする

まずはAuth0のセッティングを進めていきましょう

Applicationを作成する

Auth0の画面から Applications > Applicationsをクリックし、 Create Applicationボタンをクリックします。(下の画像の赤枠)

次にアプリケーションの種類を聞かれます。今回は普通のWebアプリケーションを使うので、 Regular Web Applicationsを選択します。

Applicationの設定を行う

Applicationができたら、URL系の設定を行います。

設定が必要なのは、 Allowed Callback URLsAllowed Logout URLs、そしてAllowed Web Originsです。

それぞれ、以下を入力します。もちろん、カスタマイズ可能なので独自の値を入れても構いません。

  • Allowed Callback URLs: http://localhost:8080/login/oauth2/code/auth0
  • Allowed Logout URLs: http://localhost:8080
  • Allowed Web Origins: http://localhost:8080

入力したら、画面を下にスクロールし、 Save Changesボタンをクリックします。

これで完了です。

Spring Frameworkプロジェクトの設定を行う

Dependenciesを整える

以下のDependenciesが必要となりますので、プロジェクトに取り込んでください。

  • org.springframework.boot:spring-boot-starter-oauth2-client

application.yamlを整える

  • 元々は application.propertiesというファイルでしたが、ここでは拡張子を .yaml形式に変更したものを使います。
server:
  port: 8080
spring:
  security:
    oauth2:
      client:
        registration:
          auth0:
            client-id: ここにAuth0のクライアントIDを貼る
            client-secret: ここにAuth0のクライアントシークレットを貼る
            scope:
              - openid
              - profile
              - email
        provider:
          auth0:
            issuer-uri: ここにAuth0のドメインを貼る

Controllerを整える

これは適当に作ります。ログイン認証が成功した後に最初に来るページのコントローラになります。

Viewテンプレートは index.htmlを見るようにします。

package com.nothingbehind.auth0_sample.controllers;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;

@Controller
public class IndexController {

	@GetMapping("/")
	public String index(Model model) {
		return "index";
	}
}

Viewテンプレートを整える

ログインした状態で You are logged in!を表示する画面を作ります。

<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity5">
    <body>
        <div sec:authorize="!isAuthenticated()">
            <p>You are not logged in!</p>
        </div>
        <div sec:authorize="isAuthenticated()">
            <p>You are logged in!</p>
        </div>
    </body>
</html>

これで準備OKです。

ブラウザで http://localhost:8080 にアクセスしてみましょう!

ブラウザでアクセスしてみる

ブラウザで http://localhost:8080 にアクセスすると・・・・

Auth0のログインページに遷移しました!

初回であればここでサインアップしてみましょう。

ユーザ認証が終わると、、、

成功しました!

Related Posts