2022年05月13日

Agora.io Voice、Real-time Messaging SDKを利用した実装例(オンラインカラオケ)

※2020年の記事です。

Agora.io VoiceとReal-time Messaging SDKを利用した実装例をご紹介します。

お役立ち資料ダウンロード

オンライン体験におけるブイキューブの技術サポートのご案内

【図解】システム開発のお手伝い

ブイキューブのソリューションアーキテクトが、寄り添います!
各種ライブ配信システムのアーキテクチャについて わかりやすい構成図にてご紹介!

無料ダウンロード

Agora.io SDKを利用したマイクON/OFFの実装例

今回はオンラインカラオケアプリで利用できそうなリクエストごとにマイクのON/OFFをコントロールするサンプルをご紹介します。
概要としては、マイクコントロール役のホスト側、マイクをリクエストするオーディエンス側に分かれ、オーディエンス側がマイクONのリクエストメッセージを送信し、それを受信したホスト側が許可メッセージを送信後、許可を受けたオーディエンス側のマイクがON
になるというものです。
本サンプルは、Agora.ioから提供されているVoiceSDK、Real-time MessagingSDKを組み合わせて実現しています。

実装イメージ

マイクのリクエスト時メッセージ処理は、agora.io Real-time Messaging SDKで実装します。
マイクのON/OFFは、agora.io VoiceSDKで実装します。

機能一覧

[ホスト側/オーディエンス側共通]
・ログインとログアウト
・チャネルへの入室と退室
・ホストとオーディエンスの選択
・音質の設定

[ホスト側]
・オーディエンス拠点からのマイクリクエストの取得
・オーディエンス拠点へのマイク許可
・自拠点(ホスト)のマイクON/OFF

[オーディエンス側]
・ホスト側へのマイクリクエスト送信
・ホスト側から許可された場合のマイクON/OFF

開発環境

・Android Studio(Java)
・Agora.io VoiceSDK
・Real-time Messaging SDK

RTM SDKの実装例(メッセージ処理)

Agora.io Real-time Messaging SDKでログインし、メッセージをやりとり(マイクのリクエスト時メッセージ処理)するサンプルです。

本サンプルでのメッセージのやりとり(マイクのリクエスト時メッセージ処理)は、下図のようなイメージです。

インスタンスの生成

mRtmClient = RtmClient.createInstance(getBaseContext(), getString(R.string.agora_app_id), new RtmClientListener(){
    

サービスへの接続

mRtmClient.login(null, login_name + mUid, new ResultCallback<Void>() {
    

Channelへの入室

mRtmChannel = mRtmClient.createChannel(channel, new MyChannelListener());
    mRtmChannel.join(new ResultCallback<Void>() {
    

メッセージの送信

RtmMessage message = mRtmClient.createMessage();
    message.setText(Please unmute);
    mRtmChannel.sendMessage(message, new ResultCallback<Void>() {
    

メッセージの受信

class MyChannelListener implements RtmChannelListener {
       @Override
       public void onMessageReceived(final RtmMessage message, final RtmChannelMember fromMember) {
    
           String account = fromMember.getUserId();
           String msg = message.getText();
           //Please unmute//
           if (getString(R.string.msg_unmute).equals(arrMsg[0])) {
               //リクエスト文字を画面に表示
               txReq =  (TextView) findViewById(R.id.textReq3);
               txReq.setText(getString(R.string.msg_unmute));
           }
    
           //You can unmute
           if (getString(R.string.msg_can_unmute).equals(arrMsg[0])) {
               //マイクをON
               doVoiceLocalMute(false);
           }
       }
    }
    

※メッセージが受信されるとonMessageReceivedがコールバックされます。
fromMemberには送信元のメンバー情報、messageには受信メッセージが入っています。

※メッセージの内容を受けて処理を切り分けます。

Voice SDKの実装例(音質・マイクON/OFF)

Agora.io voice SDKでログインし、音質設定、マイクをON/OFFするサンプルです

インスタンスの生成

mRtcEngine = RtcEngine.create(getBaseContext(), appId, mRtcEventHandler);
    

チャネルプロファイルの設定

mRtcEngine.setChannelProfile(Constants.CHANNEL_PROFILE_COMMUNICATION);
    

オーディオプロファイルの設定

mRtcEngine.setAudioProfile(Constants.AUDIO_PROFILE_MUSIC_STANDARD,Constants.AUDIO_SCENARIO_SHOWROOM);
    

※第1引数にprofile、第2引数にscenarioを選択します。

Channelへの入室

mRtcEngine.joinChannel(null, channel, null, HOST_UID);
    

マイクのON・OFF

mRtcEngine.muteLocalAudioStream(true);
    

※マイクOFFの時はtrue、マイクONの時はfalseを指定します。

動作確認

動作を確認してみます。

1.初期表示

PCとAndroidデバイスをUSB接続し、AndroidStudioから実行ボタンをクリックし開始します。ビルドが完了すると、Androidデバイス上に画面が表示されます。

 

(ホスト側、オーディエンス側)

2.ログイン

2-1. ホスト側

1.(ホスト側)「host」チェックONの状態で「LOGIN」ボタンをクリックします。
2.(ホスト側)「オーディオプロファイル」は、プロファイル:”MUSIC_STANDARD”、シナリオ:”SHORWROOM”をそれぞれ選択します。
3.(ホスト側)「JOIN」ボタンをクリックします。

 

(ホスト側)

2-2. オーディエンス側

1.(オーディエンス側)「host」チェックOFFにした状態にして、ホスト側と同じ手順で入室します。
※同様に2拠点のオーディエンスが入室しています。

 

(オーディエンス側)

※この時点ではホスト側のみマイクON、オーディエンス側はマイクOFFになっています。

3-1.オーディエンス側

  1. (オーディエンス側)マイクをリクエストするため、「SENDMESSAGE(UNMUTE)」ボタンをクリックします。

(オーディエンス側)

3-2.ホスト側

1.(ホスト側)オーディエンス側からのマイクリクエストを受け取ります。
ホスト側に”Please unmute”が表示されてます。

 

(ホスト側)

4.マイクを許可

4-1.ホスト側
  1. (ホスト側)オーディエンス側のマイクを許可するため、「UNMUTE」ボタンをクリックします。
  2. (ホスト側)オーディエンス側からの完了メッセージ(unMuted)が届き、”unMuted”が表示されます。
    ※この時点ではホスト側、オーディエンス側(58841)の2拠点がマイクONになります。

  3. (ホスト側)必要に応じてホストは自分のマイクをOFFにします。
    ※オーディエンス側(58841)のみがマイクONになります。

(ホスト側)

4-2.オーディエンス側
  1. (オーディエンス側)ホスト側から許可メッセージ(You can unmute)が届き、自拠点のマイクをONにします。

(オーディエンス側)

5.退室とログアウト

(ホスト側、オーディエンス側)「LEAVE」ボタンをクリックし退室します。(同時にログアウトもされます)

ガイドブックダウンロード

【すぐ読める!ガイドブック】ビデオ通話・ライブ配信SDK「Agora」

【大充実】通話・配信SDK「Agora」ガイドブック

通話・配信サービス開発や、配信技術のリプレイスを検討中の方、必見の内容です。
Agora SDKの特徴から活用例まで徹底解説!

無料ダウンロード
ブイキューブ

執筆者ブイキューブ

Agoraの日本総代理店として、配信/通話SDKの提供だけでなく、導入支援から行い幅広いコミュニケーションサービスに携わっている。

関連記事

先頭へ戻る