close

Ndërtimi i një serveri bazë WebSocket me Node.js

Një real-time aplikacion chat është një shembull i shkëlqyer se si të përdoret WebSocket për Node.js të krijuar një përvojë interaktive dhe tërheqëse të përdoruesit. Në këtë artikull, ne do të shqyrtojmë se si të ndërtojmë një real-time aplikacion chat duke përdorur WebSocket dhe Node.js.

Hapi 1: Vendosja e mjedisit

Së pari, sigurohuni që të keni Node.js instaluar në kompjuterin tuaj. Krijoni një dosje të re për projektin tuaj dhe lundroni në të duke përdorur Terminal ose Command Prompt.

Hapi 2: Instalimi i WebSocket Bibliotekës

Si më parë, përdorni bibliotekën "ws" për të instaluar bibliotekën WebSocket:

npm install ws

Hapi 3: Ndërtimi i WebSocket serverit

Krijoni një skedar me emrin server.js  dhe shkruani kodin e mëposhtëm:

// Import the WebSocket library  
const WebSocket = require('ws');  
  
// Create a WebSocket server  
const server = new WebSocket.Server({ port: 8080 });  
  
// List of connections(clients)  
const clients = new Set();  
  
// Handle new connections  
server.on('connection',(socket) => {  
    console.log('Client connected.');  
  
    // Add connection to the list  
    clients.add(socket);  
  
    // Handle incoming messages from the client  
    socket.on('message',(message) => {  
        // Send the message to all other connections  
        for(const client of clients) {  
            if(client !== socket) {  
                client.send(message);  
            }  
        }  
    });  
  
    // Handle connection close  
    socket.on('close',() => {  
        console.log('Client disconnected.');  
        // Remove the connection from the list  
        clients.delete(socket);  
    });  
});

Hapi 4: Krijimi i Ndërfaqes së Përdoruesit(Klienti)

Krijoni një skedar me emrin index.html dhe shkruani kodin e mëposhtëm:

<!DOCTYPE html>  
<html>  
<head>  
    <title>Real-Time Chat</title>  
</head>  
<body>  
    <input type="text" id="message" placeholder="Type a message">  
    <button onclick="send()">Send</button>  
    <div id="chat"></div>  
      
    <script>  
        const socket = new WebSocket('ws://localhost:8080');  
        socket.onmessage =(event) => {  
            const chat = document.getElementById('chat');  
            chat.innerHTML += '<p>' + event.data + '</p>';  
        };  
  
        function send() {  
            const messageInput = document.getElementById('message');  
            const message = messageInput.value;  
            socket.send(message);  
            messageInput.value = '';  
        }  
    </script>  
</body>  
</html>

Hapi 5: Drejtimi i serverit dhe hapja e shfletuesit

Në Terminal, ekzekutoni komandën e mëposhtme për të nisur WebSocket serverin:

node server.js

Hapni një shfletues uebi dhe lundroni te " http://localhost:8080 " për të përdorur real-time aplikacionin e bisedës.

 

konkluzioni

urime! Ju keni ndërtuar me sukses një real-time aplikacion chat duke përdorur WebSocket dhe Node.js. Ky aplikacion i lejon përdoruesit të ndërveprojnë dhe të dërgojnë/marrin mesazhe në real-time. Mund të vazhdoni ta zgjeroni dhe personalizoni këtë aplikacion për të krijuar veçori të ndryshme emocionuese!