Web Socket #
WebSocket adalah protokol komunikasi yang menyediakan saluran komunikasi full-duplex melalui satu koneksi TCP. WebSocket memungkinkan komunikasi dua arah antara klien dan server, yang membuatnya ideal untuk aplikasi real-time seperti obrolan, game online, dan dashboard yang memerlukan pembaruan langsung. Dalam Dart, Anda dapat menggunakan pustaka dart:io untuk mengimplementasikan WebSocket.
Berikut penjelasan lengkap mengenai penggunaan WebSocket dalam bahasa Dart:
Pengantar WebSocket #
WebSocket berbeda dengan HTTP karena WebSocket memungkinkan koneksi yang tetap terbuka antara klien dan server. Setelah koneksi WebSocket dibuat, data dapat dikirim bolak-balik tanpa perlu membuka koneksi baru untuk setiap pesan.
Membuat WebSocket Server di Dart #
Untuk membuat server WebSocket, Anda dapat menggunakan kelas HttpServer dan WebSocketTransformer dari pustaka dart:io.
Contoh: Membuat WebSocket Server Sederhana
import 'dart:io';
void main() async {
var server = await HttpServer.bind(InternetAddress.anyIPv4, 8080);
print('WebSocket Server berjalan di ws://${server.address.address}:${server.port}/');
await for (HttpRequest request in server) {
if (WebSocketTransformer.isUpgradeRequest(request)) {
var socket = await WebSocketTransformer.upgrade(request);
handleWebSocket(socket);
} else {
request.response
..statusCode = HttpStatus.forbidden
..write('WebSocket connections only.')
..close();
}
}
}
void handleWebSocket(WebSocket socket) {
socket.listen((message) {
print('Pesan diterima: $message');
socket.add('Echo: $message');
}, onDone: () {
print('Koneksi ditutup.');
});
}
Penjelasan:
- HttpServer.bind: Membuat server HTTP yang mendengarkan pada port tertentu.
- WebSocketTransformer.isUpgradeRequest: Memeriksa apakah permintaan yang masuk adalah permintaan upgrade untuk WebSocket.
- WebSocketTransformer.upgrade: Meningkatkan koneksi HTTP menjadi koneksi WebSocket.
- socket.listen: Menyediakan aliran data yang dapat digunakan untuk menerima pesan dari klien. Di sini, server merespons dengan pesan “Echo”.
Membuat WebSocket Client di Dart #
Dart juga menyediakan kemampuan untuk membuat klien WebSocket, yang dapat berkomunikasi dengan server WebSocket.
Contoh: Membuat WebSocket Client Sederhana
import 'dart:io';
void main() async {
var socket = await WebSocket.connect('ws://localhost:8080');
print('Terhubung ke WebSocket Server.');
socket.add('Hello Server!');
socket.listen((message) {
print('Pesan dari server: $message');
}, onDone: () {
print('Koneksi ke server ditutup.');
});
}
Penjelasan:
- WebSocket.connect: Menghubungkan klien ke server WebSocket dengan URL yang diberikan.
- socket.add: Mengirim pesan ke server melalui koneksi WebSocket.
- socket.listen: Mendengarkan pesan yang diterima dari server.
Mengelola Koneksi WebSocket #
Koneksi WebSocket dapat dikelola lebih lanjut dengan menangani event seperti koneksi terputus, kesalahan, atau penutupan koneksi.
Contoh: Menangani Event Koneksi
import 'dart:io';
void main() async {
var server = await HttpServer.bind(InternetAddress.anyIPv4, 8080);
print('WebSocket Server berjalan di ws://${server.address.address}:${server.port}/');
await for (HttpRequest request in server) {
if (WebSocketTransformer.isUpgradeRequest(request)) {
var socket = await WebSocketTransformer.upgrade(request);
handleWebSocket(socket);
} else {
request.response
..statusCode = HttpStatus.forbidden
..write('WebSocket connections only.')
..close();
}
}
}
void handleWebSocket(WebSocket socket) {
socket.listen(
(message) {
print('Pesan diterima: $message');
socket.add('Echo: $message');
},
onDone: () {
print('Koneksi ditutup oleh klien.');
},
onError: (error) {
print('Terjadi kesalahan: $error');
},
cancelOnError: true,
);
}
Penjelasan:
- onDone: Dipanggil ketika klien menutup koneksi.
- onError: Dipanggil ketika terjadi kesalahan pada koneksi.
- cancelOnError: Mengatur apakah aliran harus dibatalkan ketika kesalahan terjadi.
Broadcasting Pesan ke Banyak Klien #
Dalam aplikasi real-time, server sering kali perlu menyiarkan pesan ke banyak klien yang terhubung. Dart memungkinkan hal ini dengan menyimpan referensi ke setiap koneksi WebSocket.
Contoh: Broadcasting Pesan ke Semua Klien
import 'dart:io';
final List<WebSocket> clients = [];
void main() async {
var server = await HttpServer.bind(InternetAddress.anyIPv4, 8080);
print('WebSocket Server berjalan di ws://${server.address.address}:${server.port}/');
await for (HttpRequest request in server) {
if (WebSocketTransformer.isUpgradeRequest(request)) {
var socket = await WebSocketTransformer.upgrade(request);
clients.add(socket);
handleWebSocket(socket);
} else {
request.response
..statusCode = HttpStatus.forbidden
..write('WebSocket connections only.')
..close();
}
}
}
void handleWebSocket(WebSocket socket) {
socket.listen((message) {
print('Pesan diterima: $message');
broadcastMessage('Broadcast: $message');
}, onDone: () {
print('Koneksi ditutup oleh klien.');
clients.remove(socket);
});
}
void broadcastMessage(String message) {
for (var client in clients) {
client.add(message);
}
}
Penjelasan:
- clients: Daftar untuk menyimpan semua koneksi WebSocket yang aktif.
- broadcastMessage: Fungsi ini mengirimkan pesan yang diterima dari satu klien ke semua klien yang terhubung.
Menggunakan WebSocket dengan Protokol HTTPS #
WebSocket juga dapat digunakan melalui protokol HTTPS menggunakan WSS (WebSocket Secure). Ini membutuhkan sertifikat SSL/TLS.
Contoh: WebSocket Secure (WSS) Server
import 'dart:io';
void main() async {
var server = await HttpServer.bindSecure(
InternetAddress.anyIPv4,
8080,
SecurityContext()
..useCertificateChain('server.crt')
..usePrivateKey('server.key'),
);
print('Secure WebSocket Server berjalan di wss://${server.address.address}:${server.port}/');
await for (HttpRequest request in server) {
if (WebSocketTransformer.isUpgradeRequest(request)) {
var socket = await WebSocketTransformer.upgrade(request);
handleWebSocket(socket);
} else {
request.response
..statusCode = HttpStatus.forbidden
..write('WebSocket connections only.')
..close();
}
}
}
void handleWebSocket(WebSocket socket) {
socket.listen((message) {
print('Pesan diterima: $message');
socket.add('Echo: $message');
}, onDone: () {
print('Koneksi ditutup.');
});
}
Penjelasan:
- HttpServer.bindSecure: Digunakan untuk membuat server WebSocket yang aman dengan HTTPS.
- SecurityContext: Menyediakan konteks keamanan untuk mengelola sertifikat SSL/TLS.
Kesimpulan #
WebSocket dalam Dart adalah cara yang efisien untuk membangun aplikasi real-time dengan komunikasi dua arah antara klien dan server. Dengan menggunakan pustaka dart:io, Anda dapat membuat server WebSocket, menangani koneksi klien, mengirim dan menerima pesan, serta menyiarkan pesan ke banyak klien.
Dalam implementasi yang lebih kompleks, WebSocket dapat digabungkan dengan berbagai teknologi lain seperti penyimpanan data real-time, manajemen sesi, dan otentikasi untuk membangun aplikasi yang handal dan aman. Dart juga memungkinkan Anda menggunakan WebSocket melalui koneksi aman (WSS) dengan HTTPS, menjadikan aplikasi Anda lebih aman dalam komunikasi data.