Membuka Koneksi WebSocket
Hubungkan ke server WebSocket.
Membuka Koneksi WebSocket adalah pelajaran JavaScript Academy gratis di CoddyKit. Ini adalah pelajaran 1 dari 4. Kamu bisa membaca pelajaran lengkapnya di bawah secara gratis — lalu praktikkan langsung di browser dengan editor kode bawaan dan tutor AI 24/7. Ini adalah bagian dari jalur belajar JavaScript Academy, dan progresmu tersinkronisasi di web dan aplikasi CoddyKit. Kursus JavaScript Academy mencakup 4 pelajaran total.
Apa Itu WebSockets?
WebSockets menyediakan koneksi persisten dupleks penuh antara peramban dan server melalui satu koneksi TCP. Berbeda dari permintaan/tanggapan HTTP, kedua sisi dapat mengirim pesan kapan saja — ideal untuk obrolan, umpan langsung, dan permainan.
Skema ws dan wss
URL WebSocket menggunakan ws:// (biasa) atau wss:// (dienkripsi dengan TLS). Dalam produksi, selalu utamakan wss://, sama seperti https.
const url = "wss://example.com/socket";Membuat Koneksi
Buat socket dengan new WebSocket(url). Proses jabat tangan dimulai segera; koneksi belum siap sampai terbuka.
const socket = new WebSocket("wss://example.com/socket");
console.log(socket.url);Kejadian onopen
onopen dijalankan setelah proses jabat tangan selesai. Hanya setelah itu data aman untuk dikirim.
socket.onopen = (event) => {
console.log("Connection established");
socket.send("Hello server");
};Alternatif addEventListener
Anda dapat menggunakan addEventListener, bukan properti on*, untuk memasang beberapa penangan.
socket.addEventListener("open", () => {
console.log("open via listener");
});readyState Koneksi
readyState melaporkan siklus hidup: CONNECTING (0), OPEN (1), CLOSING (2), CLOSED (3).
if (socket.readyState === WebSocket.OPEN) {
socket.send("ready!");
}Subprotokol
Argumen kedua digunakan untuk menegosiasikan subprotokol. Server memilih salah satunya, dan Anda dapat membaca socket.protocol setelah koneksi terbuka.
const s = new WebSocket("wss://example.com", ["chat", "v2.chat"]);
s.onopen = () => console.log("Using", s.protocol);Asal yang Sama dan Konten Campuran
Halaman yang dimuat melalui https hanya boleh membuka koneksi wss:// — membuka ws:// akan diblokir sebagai konten campuran. Rencanakan URL Anda dengan tepat.
Tipe Biner
Atur binaryType ke "blob" (bawaan) atau "arraybuffer" untuk menentukan cara bingkai biner diterima.
socket.binaryType = "arraybuffer";Klien Minimal
Menggabungkan semuanya: buka koneksi, catat status, lalu bersihkan sumber daya.
const socket = new WebSocket("wss://example.com/socket");
socket.onopen = () => console.log("opened");
socket.onclose = () => console.log("closed");Batas Waktu Koneksi
WebSockets tidak memiliki batas waktu koneksi bawaan. Gunakan pengatur waktu yang menutup socket jika onopen belum dijalankan dalam waktu yang ditentukan.
const socket = new WebSocket(url);
const timer = setTimeout(() => {
if (socket.readyState !== WebSocket.OPEN) socket.close();
}, 5000);
socket.onopen = () => clearTimeout(timer);Pemeriksaan Cepat
Uji dasar-dasar koneksi.
Rangkuman: Membuka Koneksi
Anda telah mempelajari skema ws/wss, membuat socket dengan new WebSocket, menangani onopen, memeriksa readyState, menegosiasikan subprotokol, dan menambahkan batas waktu koneksi. Selanjutnya: mengirim dan menerima pesan.
Pertanyaan yang Sering Diajukan
Apakah pelajaran “Membuka Koneksi WebSocket” gratis?
Ya — teks lengkap “Membuka Koneksi WebSocket” gratis dibaca di sini di web. Untuk praktiknya secara interaktif (editor kode bawaan dan tutor AI 24/7) dan buka sisa kursus JavaScript Academy, upgrade ke CoddyKit PRO. Kursus JavaScript Academy mencakup 4 pelajaran total.
Apa yang akan aku pelajari di “Membuka Koneksi WebSocket”?
Hubungkan ke server WebSocket. Kamu berlatih JavaScript Academy dengan kode praktik yang langsung kamu jalankan di browser, dan tutor AI 24/7 menjawab pertanyaanmu saat kamu mengerjakan pelajaran ini.
Apakah aku perlu pengalaman untuk memulai JavaScript Academy?
Tidak diperlukan pengalaman sebelumnya. JavaScript Academy di CoddyKit dirancang untuk pemula hingga pelajar tingkat lanjut, jadi kamu bisa memulai di sini atau dari awal dan belajar sesuai kecepatan kamu sendiri. Ini adalah pelajaran 1 dari 4.
Berapa lama pelajaran “Membuka Koneksi WebSocket” memakan waktu?
Sebagian besar pelajaran CoddyKit memakan waktu sekitar 5–10 menit. Setiap pelajaran ringkas dan interaktif, jadi kamu membuat kemajuan stabil dan melanjutkan dari tempat kamu tinggalkan di web dan aplikasi.
Bisakah aku menulis dan menjalankan kode dalam pelajaran JavaScript Academy ini?
Ya. Setiap pelajaran JavaScript Academy menyertakan editor kode bawaan, jadi kamu menulis dan menjalankan kode nyata langsung di browser dan mendapatkan umpan balik AI instan — tidak diperlukan penyiapan lokal.
Semua pelajaran dalam kursus ini
- Membuka Koneksi WebSocket
- Mengirim dan Menerima Pesan
- Siklus Hidup dan Error Koneksi
- Strategi Koneksi Ulang