Skip to main content
Version: 1.3.0

Chat using WebRTC

What for?​

P2P(Peer to Peer) is a means of communication with the lowest possible cost.

This module provides P2P text/voice chat for Native(C#) and WebGL(JavaScript).

Specification​

  • P2P text chat is available.
  • P2P voice chat is available.

Architecture​

Unity​

classDiagram TextChatClientProvider ..> TextChatClient TextChatClient <|-- NativeTextChatClient TextChatClient <|-- WebGLTextChatClient VoiceChatClientProvider ..> VoiceChatClient VoiceChatClientProvider ..> VoiceChatConfig VoiceChatClient <|-- NativeVoiceChatClient VoiceChatClient <|-- WebGLVoiceChatClient class TextChatClientProvider { +Provide(peerClient)$ TextChatClient } class TextChatClient { +OnMessageReceived IObservable +Send(message) void +Clear() void } class NativeTextChatClient { } class WebGLTextChatClient { } class VoiceChatClientProvider { +Provide(peerClient, config)$ VoiceChatClient } class VoiceChatConfig { } class VoiceChatClient { +OnMuted IObservable +OnAudioLevelChanged IObservable +HasMicrophone() bool +ToggleMute() void +SetInVolume(volume) void +SetOutVolume(volume) void +Clear() void } class NativeVoiceChatClient { } class WebGLVoiceChatClient { }

JavaScript​

classDiagram WebGLTextChatClient ..> WebGLHelper WebGLHelper ..> TextChatClient TextChatAdapter ..> TextChatClient WebGLVoiceChatClient ..> WebGLHelper WebGLHelper ..> VoiceChatClient VoiceChatAdapter ..> VoiceChatClient class WebGLHelper { <<C#>> } class WebGLTextChatClient { <<C#>> } class WebGLVoiceChatClient { <<C#>> } class TextChatAdapter { <<TypeScript>> } class TextChatClient { <<TypeScript>> } class VoiceChatAdapter { <<TypeScript>> } class VoiceChatClient { <<TypeScript>> }

Installation​

Package​

Unity​

https://github.com/extreal-dev/Extreal.Integration.Chat.WebRTC.git

npm​

@extreal-dev/extreal.integration.chat.webrtc

Dependencies​

This module uses the following packages.

Unity​

npm​

Please refer to Release for the correspondence between module version and each package version.

Settings​

This module uses P2P.WebRTC to realize P2P. WebRTC Settings is required. Please add the following initialization after setting up P2P.WebRTC.

Create a Client with each Provider.

public class ClientControlScope : LifetimeScope
{
    protected override void Configure(IContainerBuilder builder)
    {
        var peerConfig = new PeerConfig("http://127.0.0.1:3010");
        var peerClient = PeerClientProvider.Provide(peerConfig);
        builder.RegisterComponent(peerClient);

        var textChatClient = TextChatClientProvider.Provide(peerClient);
        builder.RegisterComponent(textChatClient);

        var voiceChatClient = VoiceChatClientProvider.Provide(peerClient);
        builder.RegisterComponent(voiceChatClient);

        builder.RegisterEntryPoint<ClientControlPresenter>();
    }
}

If used with WebGL, further JavaScript initialization is required. Create each Adapter and call the adapt function.

import { PeerAdapter } from "@extreal-dev/extreal.integration.p2p.webrtc";
import { TextChatAdapter, VoiceChatAdapter } from "@extreal-dev/extreal.integration.chat.webrtc";

const peerAdapter = new PeerAdapter();
peerAdapter.adapt();

const textChatAdapter = new TextChatAdapter();
textChatAdapter.adapt(peerAdapter.getPeerClient);

const voiceChatAdapter = new VoiceChatAdapter();
voiceChatAdapter.adapt(peerAdapter.getPeerClient);

Usage​

Perform P2P text chat​

Text chat uses P2P.WebRTC to realize P2P. Use P2P.WebRTC's API to establish P2P connections.

Text chat features are provided by TextChatClient.

Use the Send method to send messages.

textChatClient.Send(message);

The OnMessageReceived event is used to receive a message. A string message is passed as a parameter.

textChatClient.OnMessageReceived
    .Subscribe(message =>
    {
        // do something
    })
    .AddTo(disposables);

To end the text chat, use the Clear method.

textChatClient.Clear();

Perform P2P voice chat​

info

If the microphone is not available, only the speaker is enabled.

Voice chat uses P2P.WebRTC to realize P2P. Please use P2P.WebRTC's API to establish P2P connections.

Voice Chat features are provided by VoiceChatClient.

Use the ToggleMute method to switch mute.

voiceChatClient.ToggleMute();

The value(bool) after switching to mute is received in the OnMuted event.

voiceChatClient.OnMuted
    .Subscribe(muted =>
    {
        // do something
    })
    .AddTo(disposables);

If you want to specify the default value for mute, specify it in VoiceChatConfig.

var voiceChatConfig = new VoiceChatConfig(initialMute: false);
var voiceChatClient = VoiceChatClientProvider.Provide(peerClient, voiceChatConfig);

Use the SetInVolume method to adjust the input volume.

voiceChatClient.SetInVolume(volume);

If you want to specify the default value for the input volume, specify it in VoiceChatConfig.

var voiceChatConfig = new VoiceChatConfig(initialInVolume: 0.8f);
var voiceChatClient = VoiceChatClientProvider.Provide(peerClient, voiceChatConfig);

Use the SetOutVolume method to adjust the output volume.

voiceChatClient.SetOutVolume(volume);

If you want to specify the default value for the output volume, specify it in VoiceChatConfig.

var voiceChatConfig = new VoiceChatConfig(initialOutVolume: 0.8f);
var voiceChatClient = VoiceChatClientProvider.Provide(peerClient, voiceChatConfig);

Add a processing triggered by VoiceChat Client state​

VoiceChatClient has the following event notifications.

  • OnAudioLevelChanged
    • Timing: When there is a change in audio level at each specified frequency
    • Type: IObservable
    • Parameters: ID and audio level pairs

If you want to specify how often the speech volume is acquired, specify it in VoiceChatConfig.

var voiceChatConfig = new VoiceChatConfig(InitialAudioLevelCheckIntervalSeconds: 0.5f);
var voiceChatClient = VoiceChatClientProvider.Provide(peerClient, voiceChatConfig);