Snapchat をアイデンティティプロバイダーとして設定する

Last updated on August 5, 2026

注釈：本資料はAI技術を用いて翻訳されています。

概要​

このガイドは、認証済みの Snapchat 開発者が Snapchat アカウントを AccelByte Gaming Services (AGS) に接続できるよう支援することを目的としています。ここに記載されていない Snapchat サービスの追加機能を設定する必要がある場合もあります。Snapchat サービスの設定に関する詳細については、Snapchat の担当者に直接問い合わせ、Snapchat の公式ドキュメントを確認することをお勧めします。

important

このガイドは公開利用を目的としており、機密性のため限定的な情報のみを含んでいます。まずは完全な機密ガイドを参照することをお勧めします。機密ガイドのコピーをリクエストするには、AccelByte のテクニカルプロデューサーにお問い合わせください。

目標​

  • AccelByte Player Portal を使用して、パブリッシャーウェブサイト向けに Snapchat 認証方式を有効にする。
  • AccelByte Game SDK を使用して、ゲーム向けに Snapchat 認証方式を有効にする。

前提条件​

  • Snapchat Developer アカウント。
  • Developer アカウント配下の Organization。
  • Unreal Engine を使用する場合は、UE バージョン 4.27 または 5.0 をインストールしていること。
  • 認証を設定し、権限を管理するための AccelByte Admin Portal アカウント。
  • Player Portal と Launcher 用のパブリッシャー名前空間、およびゲーム用のゲーム名前空間。
  • Player Portal。
  • 最新バージョンの AccelByte Game SDK を導入した Unity または Unreal のゲームプロジェクト。
  • AGS の Identity and Access Management (IAM) クライアントに関する知識。

Snapchat Kit App を設定する​

Snap Kit App を作成する​

Snapchat Developer アカウントの配下に Snap Kit App を作成します。手順については、Snapchat の最初のアプリ設定ガイドに従ってください。

Snap Login Kit を有効化する​

Snap Kit App の配下で Snap Login Kit を有効化し、OAuth の Redirect URI にドメインの URL（例: https://prod.gamingservices.accelbyte.io）を入力します。詳細については、Snapchat の Login Kit に関するドキュメントを参照してください。

Snapchat のウェブログインを設定する​

AGS Public Cloud

ウェブログイン連携は現在 AGS Public Cloud では利用できず、AGS Private Cloud でのみサポートされています。

Player Portal で Snapchat ログインを設定するには、以下の手順に従ってください。これにより、プレイヤーは Snapchat アカウントを使用して Player Portal にサインインできるようになります。

  1. AGS Admin Portal で、パブリッシャー名前空間に移動します。

  2. サイドバーメニューで、Foundations > 3rd Party Integrations > Auth & Account Linking に移動します。

  3. Auth & Account Linking ページで、+ Add New をクリックします。

    AccelByte Admin Portal Login

  4. ログイン方式の一覧から、Snapchat を選択します。

    Snapchat

  5. Set up Snapchat login provider フォームが表示されます。以下のフィールドに入力します。

    • Platform ID: snapchat。自動的に設定されるため、変更はできません。
    • Client ID: Snap Kit の Client ID。
    • Client Secret: Snap Kit の Client Secret。
    • Redirect URI: ドメインの URL（例: https://prod.gamingservices.accelbyte.io）。あわせて、以下の URI を Snap Developer Portal に許可済みのリダイレクト URI として登録してください。
      • {baseUrl}
      • {baseUrl}/iam/v3/platforms/snapchat/authenticate
      • {baseUrl}/iam/v3/public/namespaces/{namespace}/users/me/platforms/snapchat/web/link/establish（アカウントリンクに使用）

    Snapchat Create Configuration

  6. Add & Activate をクリックすると、プロバイダーの作成と有効化を一度に実行できます。有効化せずに作成のみを行う場合は、Add をクリックします。

ログインプロバイダーを編集する​

  1. Auth & Account Linking ページで、Snapchat プロバイダーをクリックします。

  2. Snapchat login provider ダイアログが表示されます。必要に応じて各フィールドを更新します。

  3. 画面上部の Status トグルで、プロバイダーの有効化または無効化を切り替えます。

    Snapchat login provider edit dialog with Active toggle

  4. Save をクリックします。

Snapchat のゲーム内ログインを設定する​

ゲーム内で Snapchat ログインを設定するには、以下の手順に従ってください。これにより、プレイヤーは Snapchat アカウントを使用してゲームにサインインできるようになります。

  1. AGS Admin Portal で、ゲーム名前空間に移動します。

  2. サイドバーメニューで、Foundations > 3rd Party Integrations > Auth & Account Linking に移動します。

  3. Auth & Account Linking ページで、+ Add New をクリックします。

  4. ログイン方式の一覧から、Snapchat を選択します。

  5. 以下のフィールドに入力します。

    • Platform ID: snapchat。自動的に設定されるため、変更はできません。
    • Client ID: Snap Kit の Client ID。
    • Client Secret: Snap Kit の Client Secret。
    • Redirect URI: http://127.0.0.1。

  6. Add & Activate をクリックすると、プロバイダーの作成と有効化を一度に実行できます。有効化せずに作成のみを行う場合は、Add をクリックします。

ログインプロバイダーを編集する​

  1. Auth & Account Linking ページで、Snapchat プロバイダーをクリックします。

  2. Snapchat login provider ダイアログが表示されます。必要に応じて各フィールドを更新します。

  3. 画面上部の Status トグルで、プロバイダーの有効化または無効化を切り替えます。

  4. Save をクリックします。

IAM クライアントを作成する​

IAM クライアントは、対象プラットフォームでリリースするゲームクライアントを表すものです。

特定の SDK プラットフォーム（例: Xbox、Steam、PlayStation）向けの IAM クライアントをすでに保有している場合は、新しい IAM クライアントを作成する必要はありません。Snapchat はゲームを開発するためのプラットフォームではないため、既存の IAM クライアントをそのまま使用できます。IAM クライアントの詳細については、アプリケーションのアクセス制御を管理するを参照してください。

ゲーム内ログインの手順​

設定方法はゲームエンジンごとに異なります。以下のタブからお使いのゲームエンジンを選択してください。

Unreal ゲーム内ログイン連携​

Snapchat のゲームを AccelByte SDK と連携させてサインインできるようにすることで、プレイヤーは Snapchat の認証情報を使用してゲームにログインできるようになります。

Unreal の準備と設定​

Snapchat は UE4 向けの連携をサポートしていません。そのため、この実装ではウェブログインを使用し、Snapchat Auth から取得したログインコードをトークンとして AccelByte にログインします。Snapchat アカウントは AccelByte アカウントにリンクされ、デフォルトではヘッドレスアカウントになります。

参照: Snapchat の Login Kit ウェブチュートリアル

依存関係を追加する​

まず、AccelbyteUe4Sdk をパブリック依存モジュールとして追加します。この依存関係は、Unreal Engine で AccelByte SDK プラグインを使用してプロジェクトを連携させるために必要です。

public ABThirdPartyLogin(ReadOnlyTargetRules Target) : base(Target)
{
  PCHUsage = PCHUsageMode.UseExplicitOrSharedPCHs;

  PublicDependencyModuleNames.AddRange(new string[] { "Core", "CoreUObject", "Engine", "InputCore" , "AccelByteUe4Sdk", "Slate", "SlateCore" });

  PrivateDependencyModuleNames.AddRange(new string[] { "Json", "HTTP" });

}

<YourProject>.Target.cs と <YourProjectEditor>.Target.cs の中に AccelbyteUe4Sdk を追加します。

public ABThirdPartyLoginTarget( TargetInfo Target) : base(Target)
{
  Type = TargetType.Game;
  DefaultBuildSettings = BuildSettingsVersion.V2;
  ExtraModuleNames.AddRange( new string[] { "ABThirdPartyLogin", "AccelByteUe4Sdk" } );
}
public ABThirdPartyLoginEditorTarget( TargetInfo Target) : base(Target)
{
  Type = TargetType.Editor;
  DefaultBuildSettings = BuildSettingsVersion.V2;
  ExtraModuleNames.AddRange( new string[] { "ABThirdPartyLogin", "AccelByteUe4Sdk" } );
}

Snapchat 用に Unreal Engine プロジェクトを設定する​

DefaultEngine.ini ファイルに、以下のように AccelByte の認証情報を追加します。

[/Script/AccelByteUe4Sdk.AccelByteSettings]
ClientId=<Your Client_Id>
ClientSecret=<Your Client_Secret>
Namespace=<Your Namespace>
PublisherNamespace=<Your Publisher Namespace>
RedirectURI="http://127.0.0.1"
BaseUrl="https://prod.gamingservices.accelbyte.io"
IamServerUrl="https://prod.gamingservices.accelbyte.io/iam"
PlatformServerUrl="https://prod.gamingservices.accelbyte.io/platform"

[SnapChatConfig]
SnapChatClientId=<SnapChatClientId>

Unreal のサンプルコード実装​

以下の手順では、サンプルコードを使用して、ゲームに Snapchat 認証方式を実装する方法を説明します。

  1. ログインコンテナとして、Blueprint で WebBrowser アイテムを作成します。

  2. Snapchat のログイン URL https://accounts.snapchat.com/accounts/oauth2/auth を読み込みます。

    あわせて、以下の認証パラメータを追加します。

    1. redirect_uri: ログイン完了時のリダイレクト先 URL。リダイレクト先はゲームに戻るため、値には BaseUrl（ApiClient->Settings->BaseUrl）を指定します。また、許可リストに登録するため、Snapchat Developer Portal の Redirect Uri 設定にも同じ BaseUrl の値を入力してください。
    2. response_type: 値には "code" を指定します。
    3. scope: 権限スコープの値を指定します。 \
https://auth.snapchat.com/oauth2/api/user.display_nameユーザーの Snapchat 表示名へのアクセスを許可します
https://auth.snapchat.com/oauth2/api/user.bitmoji.avatarユーザーの Bitmoji アバターへのアクセスを許可します（ユーザーによる切り替えが可能）
https://auth.snapchat.com/oauth2/api/user.external_idアプリケーションへのユーザーのオンボーディングに使用できる、ユーザーの外部 ID へのアクセスを許可します
注記

スニペット内で使用されている AccelByteOnlineSubsystemPtr を取得するには、このガイドに従ってください。


auto ApiClient = AccelByteOnlineSubsystemPtr->GetApiClient(TEXT("YOUR_KEY"));
auto UserApi = ApiClient->GetUserApi().Pin();

void UAccelByteAuth::SnapChatLogin()
{
	FString SnapChatClientId;
	GConfig->GetString(TEXT("SnapChatConfig"), TEXT("SnapChatClientId"), SnapChatClientId, GEngineIni);
	FString RedirectUri = ApiClient->Settings->BaseUrl;
	FString Scope = TEXT("https://auth.snapchat.com/oauth2/api/user.display_name https://auth.snapchat.com/oauth2/api/user.bitmoji.avatar https://auth.snapchat.com/oauth2/api/user.external_id");

	FString Url = FString::Printf(TEXT("https://accounts.snapchat.com/accounts/oauth2/auth?client_id=%s&redirect_uri=%s&response_type=%s&scope=%s"),
		*FGenericPlatformHttp::UrlEncode(SnapChatClientId),
		*FGenericPlatformHttp::UrlEncode(RedirectUri),
		TEXT("code"),
		*FGenericPlatformHttp::UrlEncode(Scope));

	WBrowser_SnapChatAuth->LoadURL(Url);
	WBrowser_SnapChatAuth->OnUrlChanged.AddUniqueDynamic(this, &UAccelByteAuth::AccelByteLoginWithSnapChat);
}

void UAccelByteAuth::AccelByteLoginWithSnapChat(const FText& NewUrl)
{
	FString Url = NewUrl.ToString();
	FString RedirectUri = ApiClient->Settings->BaseUrl;
	FString LoginCode = TEXT("");

	if (Url.Contains(RedirectUri))
	{
		LoginCode = FGenericPlatformHttp::GetUrlParameter(Url, TEXT("code")).GetValue();
	}

	if (!LoginCode.IsEmpty()) 
	{
	UserApi->LoginWithOtherPlatform(EAccelBytePlatformType::SnapChat, LoginCode, FVoidHandler::CreateWeakLambda(this, [this]()
		{
		// Handle Success Login
		}), 
FErrorHandler::CreateWeakLambda(this, [](int32 ErrorCode, const FString& ErrorMessage)
		{
			// Handle Error Login
		}));

    // Close Login Page (Hide WebBrowser)
	}
}
注記

Snapchat 認証における platform_token は Auth Code です。

このサンプルコードをプロジェクトに追加したら、プロジェクトをコンパイル、ビルド、実行します。以上で設定は完了です。

サンプルコードをテストする​

以下の画像は、テストアプリで Snapchat アカウントを使用してログインに成功した状態を示しています。 Unreal Code Testing

に最終更新
On this page