Castify

ライブ配信 (iOS/iPadOS)

ここでは Castify SDK を使って簡単なライブ配信機能を備えた画面を実装する流れを説明します。

このチュートリアルでは SwiftUI の利用を前提としていますが、従来の ViewController を利用することも可能です。

配信機能を備えた View を作成する

以降の説明は、以下のような空の View からスタートするものとします。完全なソースコードはこちらopen in new windowから閲覧できます。

struct LiveView : View { /* TODO */ }

1. CastifyApp, Broadcaster オブジェクトを作成する

import Castify

let app = CastifyApp(token: API_TOKEN)

struct LiveView : View { 
  @StateObject var model: LiveViewModel
}

class LiveViewModel : ObservableObject {
  let broadcaster = Broadcaster(app)
}

CastifyApp は SDK の各機能にアクセスするための入り口となるオブジェクトです。

これを作成するには Castify プラットフォームのプロジェクトに対応した API トークン(上記の API_TOKEN)を引数とし、そのコンストラクターを呼び出します。

Broadcaster はライブ配信を行う機能を持ったオブジェクトで CastifyApp を渡して作成できます。

2. プレビュー画面を準備する

配信映像を UI 上にプレビュー表示するためのビューを用意します。

/* in LiveView */
var body: some View {
  Castify.Preview(media: model.broadcaster.media)
}

Castify.Preview は Broadcaster や Player のプレビューを画面に描画するビューです。

3. ライブ配信する音声/映像の入力元を設定する

Broadcaster が配信するメディアの入力元には様々な種類があり、開発者はそのうちどれかを選択します。

このチュートリアルでは、音声はマイク、映像はカメラから入力したメディアを使うとします。

broadcaster.audio = Microphone()
broadcaster.video = Camera(position: .front)

また、以下のように各メディアに対応したエンコード設定を行う必要があります。

broadcaster.audioEncoderSetting = .AAC()
broadcaster.videoEncoderSetting = .H264(bps: 1_500_000)

TIP

audio, video プロパティの内容はどちらも任意のタイミングで変更することができます。

4. ライブ配信を開始するボタンを作成する

ライブ配信の開始するボタンを用意します。

/* in LiveView */
@State var started = false {
  willSet {
    if newValue {
      model.broadcaster.start()
    }
    else {
      model.broadcaster.pause()
    }
  }
}

var body: some View {
  VStack {
    Castify.Preview(model.broadcaster.media)
    Button(action: { started.toggle() }) { 
      Text(started ? "Paused" : "Start") 
    }
  }
}

5. ライブ配信の状態を監視する

Broadcaster#start() の実行により Castify プラットフォームの配信サーバーとの接続が行われ、ライブ配信が開始します。

ライブ配信はネットワークを介した非同期的な処理なため、関数を呼び出してから実際に開始されるまでには時間的なラグがあります。また、ネットワークの問題により配信が途中で切れてしまうこともあります。こうした非同期的なイベントは全て、以下のように Broadcaster に登録したコールバックを通してアプリ側で通知を受けることができます。

BroadcasterDelegate を継承して Broadcaster からイベント通知を受け取れるようにします。

class LiveViewModel : ObservableObject, BroadcasterDelegate {

  let broadcaster = Broadcaster(app)

  @Published var state = Broadcaster.State.closed(cause: nil)

  func on(event: Broadcaster.Event, from host: Broadcaster) {
    switch event {
    case .stateChange(let state):
      self.state = state

    case .broadcast(let broadcast):
      print("broadcast: \(broadcast)")

    default: () 
    }
  }

  init() {
    broadcaster.delegate = self
    broadcaster.audio = Microphone()
    broadcaster.video = Camera(position: .front)
    broadcaster.audioEncoderSetting = .AAC()
    broadcaster.videoEncoderSetting = .H264(bps: 1_500_000)
  }
}

.onStateChange(...) イベントに含まれる state は配信の状態を表しています。

  • Broadcaster.State.closed(cause: CastifyError?)
    • 配信サーバーと未接続
  • Broadcaster.State.wip
    • 配信サーバーに接続を行っている状態
  • Broadcaster.State.opened
    • 配信サーバーと接続され配信中

Broadcaster.State.closed には cause にエラー情報が渡ってくる場合があります。これは何らかの問題により配信が中断されてしまったことを示します。その内容を確認することで原因を突き止めることが可能です。

また .broadcast(...) は Castify　プラットフォーム上に実際の配信が作成されたときに呼び出され broadcast には外部から配信にアクセスするための情報が含まれています。詳細は Broadcast を参照ください。

ここまでで、ライブ配信を行うための最小限の実装は完了しました。

配信テストを行う

アプリをビルドして iPhone 端末にデプロイしライブ配信を開始するボタンを作成するで配置した配信ボタンを押して配信を開始してみてください。

成功するとコンソールopen in new windowから配信された映像を閲覧することができます。

最終更新日: