Unreal Engine4+PlayFab　かんたんにオンラインランキングを作る～準備編～

# 前置き
C言語の初歩がわかる程度でも、どうしてもオンラインランキングだけは実装したかった為に苦心しつつもなんとか実装ができたので残しておこうと思います。
超絶初心者の私が超絶初心者向けに書きますので、間違ったことを言っている可能性があることはご了承ください。
間違いはご指摘いただけると嬉しいです。


作業環境：
Unreal Engine4.27.2
VisualStudio2019

# 自分で調べるために必要なワード
BaaS
Microsoft Azure PlayFab
　https://azure.microsoft.com/ja-jp/services/playfab/#customer-stories
PlayfFab関連で調べる際はこちら
　https://community.playfab.com/index.html
Leaderboard
　英語の上記フォーラムなど、ランキング関連を調べるときはコレ

# 事前知識
オンラインランキング、ゲームなどで調べるとUnityの記事ばかりが出てきてUE4向けの記事は皆無でした。
サーバーがいるんだろうということくらいの認識しかありませんでしたがBaaSというものがあるということで、色々調べてみましたが難しくて理解できず。

・Epic Online Subsystem
　→Blueprint非対応　4.27からのため資料が無く、C++で実装する必要があって難しい
・Game Server Service
　→Blueprint非対応　SDKは提供されていますがドキュメントもあまりなく、C++での実装のためこれも難しい

既にこの時点で厳しかったんですが、Unityのオンラインランキング記事を見ているとPlayFabというものをよく目にしたので調べてみたら、なんとPluginとしてUE4に提供されている上にBlueprintに対応していたのでコレしかない、ということで着手しました。

# PlayFabとは
Microsoftが提供しているゲーム用のBaaSらしいです。
無料で登録ができ、ゲームタイトル一つ当たり100,000ユーザーまで使用できます。
機能制限は基本的に無いようですが、オンラインマルチプレイ用の機能を使用したりする場合などは無料の範囲で使用するにしてもクレジットカードの登録が必要のようです。

今回はオンラインランキングを作成するために利用しますので特段問題ないと思います。
タイトル一つあたり100,000ユーザまで無料の範囲で、これを超えるような場合などは段階的に＄99/月や＄299/月などプランがありますので詳しくはPlayFabのHPをご確認ください。
※以前は1,000ユーザまでの時期もあったようですが拡張されているみたいです。
　2022/2/17現在

UE4ではプラグインが提供されており、BlueprintでPlayFabの機能を使用できます。
有料プラグインを除けば、BlueprintでBaaSを使えるものはこれしか見つかりませんでした。
※他にもあったら是非！教えてください。

#必要なもの

・ProjectをC++プロジェクト化しておくこと
　C++でコードを書くことはありません、最初の設定だけVisualStudio上で1行コピペ作業が必要です。
　後ほど紹介しますが、C++は書けなくても読むことに抵抗がなければかなり理解しやすくなります。

・Unreal Engine4にPlayFabプラグインのインストール

https://www.unrealengine.com/marketplace/ja/product/playfab-sdk

・VisualStudioのインストール

https://visualstudio.microsoft.com/ja/

・PlayFabのアカウント：以下から作成

https://azure.microsoft.com/ja-jp/services/playfab/#overview

# 準備

まずはUE4でPlayFabプラグインを使えるようにする必要があります。
調べると以下とGithubが見つかるかと思いますが、以下のサイトの手順で進めましょう。

https://docs.microsoft.com/ja-jp/gaming/playfab/sdks/unreal/quickstart




ややこしいですが、とにかくやらなければいけないことは2つだけです。
・プラグインの有効化
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2285992/7bb2d096-d7f2-1eea-22f7-ae34caf7a72a.png)
・プロジェクト名.Build.cs　に必要な追記を行う
C++化を行っていればSourceフォルダがあると思いますので、その中のプロジェクト名.Build.csを開きます。
ここではVisualStudioで開いています。
以下のコードを一行追加して保存してVisualStudioを閉じます。

```ruby:プロジェクト名.build.cs
PrivateDependencyModuleNames.AddRange(new string[] { "PlayFab", "PlayFabCpp", "PlayFabCommon" });
```
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2285992/d66024ea-77e6-b16c-d8d2-414bd2641ece.png)

その後、プロジェクト名.uprojectを右クリック、Ganerate VisualStudio ProjectFilesを選択します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2285992/a64e20b2-418f-c363-8010-8ee3af6ea62c.png)

準備ができました。
.uprojectを起動して確認してみましょう。
試しにLevel BluePrint内でPlayFabのLogin with PlayFabノードが呼べるかテストしてみます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2285992/8f7c3e16-7b59-572a-b328-03db89f2024c.png)

残りの準備はPlayFabの登録です。
公式サイト内の"PlayFabを無料で試す"から登録を行いましょう。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2285992/e8e5fe5e-187b-7f34-5866-d38a4d0d4d2d.png)
諸々の設定を行います。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2285992/a81d89f6-b3a3-b9a7-3c02-2e0efc1620b5.png)
登録が完了すると以下のような管理画面になります。
ゲームのタイトル名を設定していないので、My Gameとなっていますがこれが自身のゲームタイトル一覧ページです。

日本語化もできますが、UE4内のPlayFabノードの説明などが全部英語だったり、困った時に調べる際にワードがわからなくなるので英語のままブラウザの翻訳機能を使うなどで随時切り替えながらの方がやりやすいです。

日本語化の方法は、右上のアカウントをクリック→MyProfileに入るとLanguage設定がありますのでそちらで。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2285992/121caeda-f4cb-ac1d-a05d-1dd40683d44e.png)

さて、これでPlayFabで自分のスタジオ設定ができました。
準備はこれで整いましたので、まずはゲームからPlayFabへのログイン処理を組んでみましょう。
以下の赤枠のIDを使用しますのでメモしておくかブラウザはこの画面のままにしておきましょう。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2285992/584157ba-c5a6-3129-3e3a-7f4363fe8a15.png)

一旦、細かい説明は省きますので以下のように組んでみてください。
※PlayFab SettingノードのTitleIDは先程のIDです。
　MakeClientLoginWithCustomIDRequestのCustomID欄は"GettingStartedGuide"にしていますが空欄以外ならなんでもいいです。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2285992/095de06e-2b29-2074-1d7a-e26664705ffd.png)

実行すると以下のようにログイン成功となるはずです。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2285992/a66dcc5e-0165-23eb-083a-4e3cd653952d.png)

これで新規プレイヤーが登録されたことになりますので、PlayFabの管理画面に戻って確認してみましょう。
左上のDevelopmentの右横が1/100kになっていますね、これはプレイヤーの現在アカウント数/上限数です。
管理画面からMy Gameをクリックし、左側のメニューからPlayerを選択、右側のSerchをクリックします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2285992/b6061cd4-037f-2abc-6b2e-21102640c9e2.png)
やりました…！
先程UE4からアクセスして新規作成されたプレイヤーが表示されました！
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2285992/e2f15c20-1fdd-f63c-5278-6167728a984b.png)

# 次回
これにて準備編は終了です。
次回は実際にオンラインランキングのため、Leaderboardの設定と実際のBlueprintでの実装を紹介します。
細かく説明すると恐らく1回では終わらないと思いますが、近々書ききるよう努めますのでお待ちいただければと思います。