iOSのFirebase Realtime Databaseで簡単なチャットアプリを作ってみた

FirabaseのリアルタイムDBを触ったことがなかったのでどんなもんかと。ありがちではありますが簡単なチャットアプリを作ってみました。

とまあこれは一端末でやってますが、どの端末から開いてもこうなります。

１．Firebaseの登録
ここからプロジェクトを追加します。プロジェクト作成後「iOSアプリにFirebaseを追加」を選択します。ここからは完全にGoogleの案内にしたがえば迷うところはそんなにないかと。GoogleService-Info.plistファイルがダウンロードできるのでこれはXcodeプロジェクトに追加しておきましょう。plistファイルの横にでもおいておけばいいかと。あとはpodfileを編集してpod installの実行。Firebaseの初期化コードを入れろと言われるのでFirebaseApp.configure()を記述します。Firebaseをimportするのを忘れずに。コードは以下な感じ

import Firebase
@UIApplicationMain
class AppDelegate: UIResponder, UIApplicationDelegate {
   var window: UIWindow?
   func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool {
       // Override point for customization after application launch.
       FirebaseApp.configure()
       return true
   }
}

あとはアプリをビルドして実行するとFirebaseのインストールが確認されます。

２．FirebaseDatabaseの使用
Firebaseコンソールからdatabaseを選択します。そこからデータベースの作成があるのでそこをクリック、すると「ロックモード」と「テストモード」を選択できるのでちゃんとするならロックモードで設定するのですが、とりあえず試したいならテストモードではじめます。テストモードは誰でも書き込み読み込みができるので注意が必要です。
次はXcodeプロジェクトにFirebaseDatabaseを追加します。以下をpodfileに記述してpod installします。

pod 'Firebase/Database'

２．DBと接続
リファレンスはこちら
Firebaseと接続できたらあとはviewcontrollerなどでDBに書き込み読み込みを行います。今回はviewcontrollerで全て行いました。

let database = Database.database().reference().child("messages")

これでDBと接続できます。最後のchildはディレクトリのようなものになるのでなくても大丈夫です。今回はメッセージのやりとりを記録するのでmessagesと命名しています。
送信ボタンを押したときは…

@IBAction func send(_ sender: Any) {
    guard let name = nameTextField.text else {
        return
    }
    
    guard let message = messageTextField.text else {
        return
    }
    
    let data = ["name": name, "message": message]
    database.childByAutoId().setValue(data)
    messageTextField.text = ""
}

としています。今回は名前とメッセージがなかったらreturnするだけにしています。接続したdatabaseにIDを自動で振ってもらいsetValueしています。
テキストラベルから値を取得したらラベルの文字列は削除しています。もちろん削除するだけでは画面にチャットが反映されません。次に画面にDBへの変更を反映させます。

override func viewDidLoad() {
    super.viewDidLoad()
    database = Database.database().reference().child("messages")
    
    database.observe(.childAdded, with: { [weak self] snapshot in
        if let data = snapshot.value as? Dictionary<String, AnyObject> {
            if let name = data["name"], let message = data["message"] {
                self?.messages.text.append("\(name): \(message)\n")
                return
            }
        }
    })
}

databaseをobserveすることでDBに変化があった場合にイベントが発生します。今回はmessagesというUITextViewにテキストをappendしています。
今回は簡単に一つのチャットしか実現できませんが、簡単にできました。こんななんてことない機能ですが自分たちでサーバー立ててプログラム動かして…と自前でやったらけっこう大変です。
今回のソースはgithubにあげました。なおGoogleService-Info.plistだけアップしていないのでそれだけは別途必要となります。