メインコンテンツまでスキップ
新しい友達のために:

Logto は、モダンなアプリや SaaS 製品向けに設計された Auth0 の代替です。 Cloudオープンソース の両方のサービスを提供し、アイデンティティと管理 (IAM) システムを迅速に立ち上げるのに役立ちます。認証 (Authentication)、認可 (Authorization)、マルチテナント管理を すべて一つに まとめて楽しんでください。

Logto Cloud で無料の開発テナントから始めることをお勧めします。これにより、すべての機能を簡単に探索できます。

この記事では、RubyLogto を使用して、SMS Aero サインイン体験(ユーザー認証 (Authentication))を迅速に構築する手順を説明します。

前提条件

  • 稼働中の Logto インスタンス。紹介ページ をチェックして始めてください。
  • Ruby の基本的な知識。
  • 使用可能な SMS Aero アカウント。

Logto にアプリケーションを作成する

Logto は OpenID Connect (OIDC) 認証 (Authentication) と OAuth 2.0 認可 (Authorization) に基づいています。これは、複数のアプリケーション間でのフェデレーテッドアイデンティティ管理をサポートし、一般的にシングルサインオン (SSO) と呼ばれます。

あなたの 従来型 Web アプリケーションを作成するには、次の手順に従ってください:

  1. Logto コンソール を開きます。「Get started」セクションで、「View all」リンクをクリックしてアプリケーションフレームワークのリストを開きます。あるいは、Logto Console > Applications に移動し、「Create application」ボタンをクリックします。 Get started
  2. 開いたモーダルで、左側のクイックフィルターチェックボックスを使用して、利用可能なすべての "従来型 Web" フレームワークをフィルタリングするか、"従来型 Web" セクションをクリックします。"Ruby" フレームワークカードをクリックして、アプリケーションの作成を開始します。 Frameworks
  3. アプリケーション名を入力します。例:「Bookstore」と入力し、「Create application」をクリックします。

🎉 タダーン!Logto で最初のアプリケーションを作成しました。詳細な統合ガイドを含むお祝いページが表示されます。ガイドに従って、アプリケーションでの体験を確認してください。

Logto SDK を統合する

ヒント:
  • 以下のデモンストレーションは Ruby 3.3.3 を基に構築されています。
  • サンプルプロジェクトは GitHub リポジトリ で利用可能です。

インストール

Logto SDK をバンドラーを通じてインストールします:

bundle add logto

または、お好みの方法で gem を追加してください。

注記:

以下のデモンストレーションは Ruby on Rails 用です。ただし、他の Ruby フレームワークにも同じ手順を適用できます。

Logto クライアントを初期化する

Logto クライアントを初期化したいファイル(例:ベースコントローラーやミドルウェア)に、次のコードを追加します:

require "logto/client"

@client = LogtoClient.new(
config: LogtoClient::Config.new(
endpoint: "https://your-logto-endpoint.com",
app_id: "your-logto-app-id",
app_secret: "your-logto-app-secret"
),
navigate: ->(uri) { a_redirect_method(uri) },
storage: LogtoClient::SessionStorage.new(the_session_object)
)
end

例えば、Rails コントローラーでは、コードは次のようになります:

app/controllers/sample_controller.rb
require "logto/client"

class SampleController < ApplicationController
before_action :initialize_logto_client

private

def initialize_logto_client
@client = LogtoClient.new(
config: LogtoClient::Config.new(
# ...your configuration
),
# クライアントが他のホスト(つまり、あなたの Logto テナント)にリダイレクトできるようにする
navigate: ->(uri) { redirect_to(uri, allow_other_host: true) },
# コントローラーはセッションオブジェクトにアクセスできる
storage: LogtoClient::SessionStorage.new(session)
)
end
end

リダイレクト URI を設定する

詳細に入る前に、エンドユーザーの体験について簡単に説明します。サインインプロセスは次のように簡略化できます:

  1. あなたのアプリがサインインメソッドを呼び出します。
  2. ユーザーは Logto のサインインページにリダイレクトされます。ネイティブアプリの場合、システムブラウザが開かれます。
  3. ユーザーがサインインし、あなたのアプリにリダイレクトされます(リダイレクト URI として設定されています)。

リダイレクトベースのサインインについて

  1. この認証 (Authentication) プロセスは OpenID Connect (OIDC) プロトコルに従い、Logto はユーザーのサインインを保護するために厳格なセキュリティ対策を講じています。
  2. 複数のアプリがある場合、同じアイデンティティプロバイダー (Logto) を使用できます。ユーザーがあるアプリにサインインすると、Logto は別のアプリにアクセスした際に自動的にサインインプロセスを完了します。

リダイレクトベースのサインインの理論と利点について詳しく知るには、Logto サインイン体験の説明を参照してください。


注記:

以下のコードスニペットでは、あなたのアプリが http://localhost:3000/ で実行されていると仮定しています。

リダイレクト URI を設定する

Logto Console のアプリケーション詳細ページに移動します。リダイレクト URI http://localhost:3000/callback を追加します。

Logto Console のリダイレクト URI

サインインと同様に、ユーザーは共有セッションからサインアウトするために Logto にリダイレクトされるべきです。完了したら、ユーザーをあなたのウェブサイトに戻すと良いでしょう。例えば、http://localhost:3000/ をサインアウト後のリダイレクト URI セクションとして追加します。

その後、「保存」をクリックして変更を保存します。

コールバックを処理する

リダイレクト URI が http://localhost:3000/callback に設定されているため、アプリケーションで処理する必要があります。Rails コントローラーでは、次のコードを追加できます:

app/controllers/sample_controller.rb
class SampleController < ApplicationController
def callback
@client.handle_sign_in_callback(url: request.original_url)
end
end

そして、config/routes.rb にルートを設定します:

config/routes.rb
Rails.application.routes.draw do
get "/callback", to: "sample#callback"
end

サインインとサインアウトを呼び出す

アプリケーションでサインインとサインアウトを呼び出す方法はさまざまです。例えば、Rails アプリケーションに 2 つのルートを実装できます:

app/controllers/sample_controller.rb
class SampleController < ApplicationController
def sign_in
@client.sign_in(redirect_uri: request.base_url + "/callback")
end

def sign_out
@client.sign_out(post_logout_redirect_uri: request.base_url)
end

# ...
end
config/routes.rb
Rails.application.routes.draw do
get "/sign_in", to: "sample#sign_in"
get "/sign_out", to: "sample#sign_out"

# ...
end

次に、ビューにボタンやリンクを作成して、これらのアクションをトリガーできます。例えば:

app/views/sample/index.html.erb
<% if @client.is_authenticated? %>
<a href="<%= sign_out_path %>">Sign out</a>
<% else %>
<a href="<%= sign_in_path %>">Sign in</a>
<% end %>

チェックポイント: アプリケーションをテストする

これで、アプリケーションをテストできます:

  1. アプリケーションを実行すると、サインインボタンが表示されます。
  2. サインインボタンをクリックすると、SDK がサインインプロセスを初期化し、Logto のサインインページにリダイレクトされます。
  3. サインインすると、アプリケーションに戻り、サインアウトボタンが表示されます。
  4. サインアウトボタンをクリックして、トークンストレージをクリアし、サインアウトします。

SMS Aero コネクターを追加する

SMS コネクターは、認証 (Authentication) のためにワンタイムパスワード (OTP) を送信するための方法です。これは、SMS ベースの登録、サインイン、二要素認証 (2FA)、アカウント回復を含むパスワードレス認証 (Authentication) をサポートするために 電話番号 の確認を可能にします。 Logto の SMS コネクターを使用すると、数分でこれを設定できます。

SMS コネクターを追加するには、次の手順に従ってください:

  1. Console > Connector > Email and SMS connectors に移動します。
  2. 新しい SMS コネクターを追加するには、「Set up」ボタンをクリックし、「SMS Aero」を選択します。
  3. 選択したプロバイダーの README ドキュメントを確認します。
  4. 「Parameter Configuration」セクションで設定フィールドを完了します。
  5. JSON エディターを使用して SMS テンプレートをカスタマイズします。
  6. 電話番号 に確認コードを送信して設定をテストします。
Connector tab
注記:

インプレースコネクターガイドに従っている場合は、次のセクションをスキップできます。

SMS Aero コネクター を設定する

アカウント登録

SMSAero で新しいアカウントを作成します。(すでにアカウントをお持ちの場合は次のステップへ進んでください。)

アカウント認証情報の取得

コネクターを動作させるために API 認証情報が必要です。
API および SMPP から始めましょう。

「API-key」をコピーするか、新しいものを生成してください。

コネクター JSON の作成

emailapiKeysenderName フィールドに、メールアドレス、API キー、送信者名を入力してください。

送信者名には「SMSAero」と入力することで、SMSAero が提供するデフォルトの送信者名を利用できます。

用途ごとに複数の SMS コネクターテンプレートを追加できます。単一テンプレートを追加する例は以下の通りです:

  • content フィールドには任意の文字列型コンテンツを入力します。ランダム認証コード用の {{code}} プレースホルダーを忘れずに残してください。
  • usageType フィールドには、用途に応じて RegisterSignInForgotPasswordGeneric のいずれかを入力します。
    ユーザーフローをすべて有効にするには、RegisterSignInForgotPasswordGeneric の usageType を持つテンプレートが必要です。

SMSAero コネクターのテスト

電話番号を入力し「送信」をクリックすることで、「保存して完了」前に設定が動作するか確認できます。

以上です。

サインイン体験でコネクターを有効化

するのをお忘れなく。

設定タイプ

名前
emailstring
apiKeystring
senderNamestring
templatesTemplates[]
テンプレートプロパティ列挙値
contentstringN/A
usageTypeenum string'Register' / 'SignIn' / 'ForgotPassword' / 'Generic'

設定を保存する

Logto コネクター設定エリアで必要な値をすべて記入したことを確認してください。「保存して完了」または「変更を保存」をクリックすると、SMS Aero コネクターが利用可能になります。

サインイン体験で SMS Aero コネクターを有効にする

コネクターを正常に作成したら、電話番号ベースのパスワードレスログインと登録を有効にできます。

  1. コンソール > サインイン体験 > サインアップとサインイン に移動します。
  2. サインアップ方法を設定します(オプション):
    1. サインアップ識別子として "電話番号" または "Email or phone number" を選択します。
    2. "Verify at sign-up" は強制的に有効化されます。登録時に "Create a password" を有効にすることもできます。
  3. サインイン方法を設定します:
    1. サインイン識別子の一つとして 電話番号 を選択します。複数の利用可能な識別子(メール、電話番号、ユーザー名)を提供できます。
    2. 認証 (Authentication) 要素として "Verification code" および / または "Password" を選択します。
  4. "Save changes" をクリックし、"Live preview" でテストします。
Sign-in Experience tab

OTP を使用した登録とログインに加えて、パスワードの回復や ベースのセキュリティ検証を有効にし、電話番号 をプロファイルにリンクすることもできます。詳細については、エンドユーザーフロー を参照してください。

テストと検証

Ruby アプリに戻ります。これで SMS Aero を使用してサインインできるはずです。お楽しみください!

さらなる読み物

エンドユーザーフロー:Logto は、MFA やエンタープライズシングルサインオン (SSO) を含む即時使用可能な認証 (Authentication) フローを提供し、アカウント設定、セキュリティ検証、マルチテナント体験の柔軟な実装のための強力な API を備えています。

認可 (Authorization):認可 (Authorization) は、ユーザーが認証 (Authentication) された後に行えるアクションやアクセスできるリソースを定義します。ネイティブおよびシングルページアプリケーションの API を保護し、ロールベースのアクセス制御 (RBAC) を実装する方法を探ります。

組織 (Organizations):特にマルチテナント SaaS や B2B アプリで効果的な組織機能は、テナントの作成、メンバー管理、組織レベルの RBAC、およびジャストインタイムプロビジョニングを可能にします。

顧客 IAM シリーズ:顧客(または消費者)アイデンティティとアクセス管理に関する連続ブログ投稿で、101 から高度なトピックまでを網羅しています。