Node.js – Socket.IO Client Tabanlı Özelleştirmeler

Merhaba,

Web socket çalışmalarında yapısal olarak tüm süreçteki sorumluluk Node.js tarafından oluşturulan server’da üstlenilmiştir. İşte bu süreçte server’da bağlantıyla ilgili tüm olası durumlar(connect/disconnect vs.) ceyran ettiğinde alınacak refleksleri serverdan bağımsız bir şekilde client tabanlı belirleyebilmekteyiz. Bu içeriğimizde web socket çalışmalarında client tabanlı özelleştirmeleri inceliyor olacağız…

Backend

İlk olarak çalışmamızı örneklendireceğimiz backendi aşağıdaki gibi geliştirelim;

const socket = require("socket.io");
const http = require("http");

const server = http.createServer((request, response) => response.end("..."));
const io = socket.listen(server.listen(5000, () => console.log("Starting...")));

io.on("connection", socket => {
    console.log(`${socket.id} connected...`);
    socket.on("disconnect", () => console.log(`${socket.id} disconnected...`));
});

Client

Ardından client olarak kullanacağımız sayfamızın temellerini aşağıdaki gibi atalım;

<!DOCTYPE html>
<html lang="en">
<head>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.2.0/socket.io.js"></script>
    <script>
        $(() => {
            const socket = io.connect("http://localhost:5000/");
        });
    </script>
</head>
<body>
    <ul id="message">
    </ul>
</body>
</html>

Şimdi ilk olarak bağlantı prosedürlerini ele alarak asıl konumuza başlayalım;

Client Tabanlı Bağlantı Prosedürleri

  • reconnectionAttempts
    Web sokete yapılan bağlantı talebinin başarısız olduğu durumlarda kaç kez yeniden bağlantı denemesi yapılacağını belirtmektedir.

            $(() => {
                const socket = io.connect("http://localhost:5000/", {
                    reconnectionAttempts: 2
                });
            });
    

    Node.js – Socket.IO Client Tabanlı Özelleştirmeler
    Ekran görüntüsünden de anlaşılacağı üzere belirtilen değer kadar tekrar connection denenecek, aksi halde tekrar sona erecektir.
    Varsayılan olarak bir sınır tanımlanmadığından ekstra bildirim yapılmadığı sürece sonsuza kadar connection denemesi yapılacaktır.

  • reconnectionDelay
    Bağlantı talebinin başarısız olduğu durumlarda saniye cinsinden ne kadar sürede bir connection tekrarı yapılacağını belirlemektedir.

            $(() => {
                const socket = io.connect("http://localhost:5000/", {
                    reconnectionDelay: 1,
                });
            });
    

    Node.js – Socket.IO Client Tabanlı Özelleştirmeler

  • reconnection
    Socket’e yapılan ilk bağlantı talebinde bir başarısızlık söz konusuysa tekrar connectionların yapılıp yapılmayacağını belirleyen özelliktir. “true” ya da “false” değeri alır.

            $(() => {
                const socket = io.connect("http://localhost:5000/", {
                    reconnection: false
                });
            });
    

    Node.js – Socket.IO Client Tabanlı Özelleştirmeler

Durumsal Fonksiyonlar

Web socket yapılanmasında; başarısız bağlantı durumlarında yahut tekrar bağlantı kurma çalışmalarında süreçte hangi aksiyonun ceyran ettiğini takip edebilmek için sistem tarafından “emit” olarak tanımlanmış özel fonksiyonlar tetiklenmektedir. Şimdi gelin bu fonksiyonları inceleyelim;

  • reconnect_error
    Bağlantı başarısızsa tetiklenecek fonksiyondur.

            $(() => {
                const socket = io.connect("http://localhost:5000/", {
                    reconnectionAttempts: 10,
                    reconnectionDelay: 1,
                    reconnection: true
                });
                socket.on("reconnect_error", () => {
                    alert("Hata alındı...");
                });
            });
    

    Node.js – Socket.IO Client Tabanlı Özelleştirmeler

  • reconnect_attempt
    Başarısız bağlantı sonrası tekrar talepte bulunulan bağlantı esnasında tetiklenen fonksiyondur.

            $(() => {
                const socket = io.connect("http://localhost:5000/", {
                    reconnectionAttempts: 10,
                    reconnectionDelay: 1,
                    reconnection: true
                });
                socket.on("reconnect_attempt", () => {
                    alert("Tekrar bağlanılıyor...");
                });
            });
    

    Node.js – Socket.IO Client Tabanlı Özelleştirmeler

  • reconnect
    Başarısız bağlantı sonrası tekrar talepte bulunulan bağlantının başarılı olduğu durumda tetiklenir.

            $(() => {
                const socket = io.connect("http://localhost:5000/", {
                    reconnectionAttempts: 10,
                    reconnectionDelay: 1,
                    reconnection: true
                });
                socket.on("reconnect", () => {
                    alert("Bağlantı başarılı...");
                });
            });
    

    Node.js – Socket.IO Client Tabanlı Özelleştirmeler

Serverın opsiyonel durumlarına nazaran client tabanlı alınabilecek reflekslerimizi incelemiş olduk. Şimdi aşağıdaki örnek çalışmayı inceleyerek, konumuzu noktalayalım.

<!DOCTYPE html>
<html lang="en">
<head>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.2.0/socket.io.js"></script>
    <script>
        $(() => {
            const socket = io.connect("http://localhost:5000/", {
                reconnectionDelay: 1,
                reconnection: true
            });

            socket.on("reconnect_error", () => {
                $("#message").prepend(`<li style="color:red;"><strong>Hata alındı...</strong></li>`);
            });
            socket.on("reconnect_attempt", () => {
                $("#message").prepend(`<li style="color:blue;"><strong>Yeniden bağlanılıyor...</strong></li>`);
            });
            socket.on("reconnect", () => {
                $("#message").prepend(`<li style="color:green;"><strong>Bağlantı başarılı...</strong></li>`);
            });
        });
    </script>
</head>
<body>
    <ul id="message">
    </ul>
</body>
</html>

Node.js – Socket.IO Client Tabanlı Özelleştirmeler

İlgilenenlerin faydalanması dileğiyle…
Sonraki yazılarımda görüşmek üzere…
İyi çalışmalar…

Bunlar da hoşunuza gidebilir...

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

*

Copy Protected by Chetan's WP-Copyprotect.