Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

feat: add turn servers #94

Merged
merged 1 commit into from
Dec 19, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 5 additions & 1 deletion lib/.env_example
Original file line number Diff line number Diff line change
Expand Up @@ -14,4 +14,8 @@ UPLOAD_MEDIA=false

# Sockets Connection
SOCKET_RECONNECT_DELAY_SECONDS=3
EVENT_FAIL_LIMIT=5
EVENT_FAIL_LIMIT=5

# TURN Server
TURN_SERVER_USERNAME=username
TURN_SERVER_CREDENTIAL=password
55 changes: 42 additions & 13 deletions lib/features/chat/services/signaling_service.dart
Original file line number Diff line number Diff line change
@@ -1,29 +1,54 @@
import 'package:flutter/cupertino.dart';
import 'package:flutter_dotenv/flutter_dotenv.dart';
import 'package:flutter_webrtc/flutter_webrtc.dart';
import 'package:telware_cross_platform/features/chat/models/message_event_models.dart';
import 'package:telware_cross_platform/features/chat/view_model/event_handler.dart';

typedef StreamStateCallback = void Function(MediaStream stream);
typedef StreamStateCallback = void Function(MediaStream stream, String senderId);
typedef DescriptionCallback = void Function(RTCSessionDescription description, String senderId);
typedef CandidateCallback = void Function(RTCIceCandidate candidate);
typedef ResponseCallback = void Function(dynamic response);

final TURN_SERVER_USERNAME = dotenv.env['TURN_SERVER_USERNAME'] ?? '';
final TURN_SERVER_PASSWORD = dotenv.env['TURN_SERVER_CREDENTIAL'] ?? '';

class Signaling {
final EventHandler _eventHandler = EventHandler.instance;

Map<String, dynamic> configuration = {
'iceServers': [
{
'urls': [
'stun:stun1.l.google.com:19302',
'stun:stun2.l.google.com:19302'
]
}
},
{
'urls': "turn:global.relay.metered.ca:80",
'username': TURN_SERVER_USERNAME,
'credential': TURN_SERVER_PASSWORD,
},
{
'urls': "turn:global.relay.metered.ca:80?transport=tcp",
'username': TURN_SERVER_USERNAME,
'credential': TURN_SERVER_PASSWORD,
},
{
'urls': "turn:global.relay.metered.ca:443",
'username': TURN_SERVER_USERNAME,
'credential': TURN_SERVER_PASSWORD,
},
{
'urls': "turns:global.relay.metered.ca:443?transport=tcp",
'username': TURN_SERVER_USERNAME,
'credential': TURN_SERVER_PASSWORD,
},
]
};

RTCPeerConnection? peerConnection;
MediaStream? localStream;
MediaStream? remoteStream;
Map<String, MediaStream> remoteStreams = {};
StreamStateCallback? onAddRemoteStream;
DescriptionCallback? onOffer;
DescriptionCallback? onAnswer;
Expand Down Expand Up @@ -67,15 +92,15 @@ class Signaling {
return offer;
}

Future<RTCSessionDescription> createAnswer() async {
Future<RTCSessionDescription> createAnswer(String callerId) async {
localStream?.getTracks().forEach((track) {
peerConnection!.addTrack(track, localStream!);
});

peerConnection!.onTrack = (RTCTrackEvent event) async {
debugPrint('Remote stream added');
event.streams[0].getTracks().forEach((track) {
remoteStream!.addTrack(track);
remoteStreams[callerId]!.addTrack(track);
});
};

Expand Down Expand Up @@ -108,8 +133,10 @@ class Signaling {
Future<void> hangUp(RTCVideoRenderer localRenderer) async {
closeUserMedia(localRenderer);

remoteStream?.getTracks().forEach((track) {
track.stop();
remoteStreams.forEach((key, value) {
value.getTracks().forEach((track) {
track.stop();
});
});

if (peerConnection != null) peerConnection!.close();
Expand All @@ -123,7 +150,7 @@ class Signaling {
);

localStream!.dispose();
remoteStream?.dispose();
remoteStreams.clear();
}

void registerPeerConnectionListeners(String calleeId) {
Expand Down Expand Up @@ -162,9 +189,9 @@ class Signaling {
peerConnection!.onTrack = (RTCTrackEvent event) async {
if (event.streams.isNotEmpty) {
for (var track in event.streams[0].getTracks()) {
remoteStream?.addTrack(track);
remoteStreams[calleeId]?.addTrack(track);
}
onAddRemoteStream?.call(event.streams[0]);
onAddRemoteStream?.call(event.streams[0], calleeId);
}
};

Expand All @@ -174,8 +201,8 @@ class Signaling {

peerConnection!.onAddStream = (MediaStream stream) {
debugPrint('Remote stream added');
onAddRemoteStream?.call(stream);
remoteStream = stream;
onAddRemoteStream?.call(stream, calleeId);
remoteStreams[calleeId] = stream;
};
}

Expand Down Expand Up @@ -238,15 +265,17 @@ class Signaling {
);
}

Future<void> openUserMedia(RTCVideoRenderer localRenderer, RTCVideoRenderer remoteRenderer) async {
Future<void> openUserMedia(RTCVideoRenderer localRenderer) async {
var stream = await navigator.mediaDevices.getUserMedia({
'audio': true,
'video': true,
});

localRenderer.srcObject = stream;
localStream = stream;
}

Future<void> updateRemoteRenderer(RTCVideoRenderer remoteRenderer) async {
remoteRenderer.srcObject = await createLocalMediaStream('remoteStream');
}

Expand Down
46 changes: 30 additions & 16 deletions lib/features/chat/view/screens/call_screen.dart
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ class CallScreen extends ConsumerStatefulWidget {
class _CallScreenState extends ConsumerState<CallScreen> {
final Signaling _signaling = Signaling.instance;
final RTCVideoRenderer _localRenderer = RTCVideoRenderer();
final RTCVideoRenderer _remoteRenderer = RTCVideoRenderer();
final Map<String, RTCVideoRenderer> _remoteRenderers = {};
UserModel? callee;
String? voiceCallId;
late bool isCaller;
Expand All @@ -51,18 +51,18 @@ class _CallScreenState extends ConsumerState<CallScreen> {
isReceivingCall = !isCaller && voiceCallId != null;

_localRenderer.initialize();
_remoteRenderer.initialize();

_signaling.onAddRemoteStream = (stream) {
_remoteRenderer.srcObject = stream;

_signaling.onAddRemoteStream = (stream, clientId) {
_remoteRenderers[clientId]!.srcObject = stream;
setState(() {});
};

// Initialize media just one time
if (_localRenderer.srcObject == null) {
_signaling.openUserMedia(_localRenderer, _remoteRenderer);
_signaling.openUserMedia(_localRenderer);
}
_signaling.toggleVideoStream(false);
_signaling.toggleVideoStream(ref.read(callStateProvider).isVideoCall);

WidgetsBinding.instance.addPostFrameCallback((_) {
if (callee != null && isCaller) {
Expand All @@ -80,16 +80,16 @@ class _CallScreenState extends ConsumerState<CallScreen> {

void _initializeSignaling() {
debugPrint("Call: Initializing signaling");
_signaling.onAddRemoteStream = (stream) {
_remoteRenderer.srcObject = stream;
_signaling.onAddRemoteStream = (stream, clientId) {
_remoteRenderers[clientId]!.srcObject = stream;
setState(() {});
};

_signaling.onOffer = (description, senderId) async {
// If receiving a call, set remote description and create an answer
await _signaling.registerPeerConnection(senderId);
await _signaling.setRemoteDescription(description);
final answer = await _signaling.createAnswer();
final answer = await _signaling.createAnswer(senderId);
_signaling.sendAnswer(answer, senderId);
startCall();
};
Expand All @@ -111,13 +111,18 @@ class _CallScreenState extends ConsumerState<CallScreen> {
};

_signaling.onReceiveJoinedCall = (response) {
// Create an offer to the user
_signaling.createOffer(response['clientId']).then((offer) {
_signaling.sendOffer(offer, response['clientId']);
final clientId = response['clientId'];
print("# Call: Received joined call from $clientId");
_remoteRenderers[clientId] = RTCVideoRenderer();
_remoteRenderers[clientId]!.initialize();
_signaling.updateRemoteRenderer(_remoteRenderers[clientId]!).then((_) {
_signaling.createOffer(clientId).then((offer) {
_signaling.sendOffer(offer, response['clientId']);
});

if (ref.read(callStateProvider).isCallInProgress) return;
ref.read(callStateProvider.notifier).setCallInProgress(true);
});

if (ref.read(callStateProvider).isCallInProgress) return;
ref.read(callStateProvider.notifier).setCallInProgress(true);
};

_signaling.onReceiveLeftCall = (response) {
Expand Down Expand Up @@ -162,7 +167,16 @@ class _CallScreenState extends ConsumerState<CallScreen> {
children: [
// Remote video
if (callState.isVideoCall)
Positioned.fill(child: RTCVideoView(_remoteRenderer))
// Display all remote renderers as cubes beside each other
Row(
children: _remoteRenderers.values
.map((renderer) => SizedBox(
width: 100,
height: 150,
child: RTCVideoView(renderer),
))
.toList(),
)
else
Container(
decoration: BoxDecoration(
Expand Down
Loading