Aikace real-time -aikacen taɗi kyakkyawan misali ne na yadda ake amfani WebSocket da shi Node.js don ƙirƙirar ƙwarewar mai amfani mai ma'amala da jan hankali. A cikin wannan labarin, za mu bincika yadda ake gina real-time aikace-aikacen taɗi ta amfani WebSocket da Node.js.
Mataki 1: Saita Muhalli
Da farko, ka tabbata ka Node.js shigar a kan kwamfutarka. Ƙirƙiri sabon babban fayil don aikin ku kuma kewaya cikin ta ta amfani Terminal da ko Command Prompt.
Mataki 2: Shigar da WebSocket Library
Kamar a da, yi amfani da ɗakin karatu na "ws" don shigar da WebSocket ɗakin karatu:
npm install ws
Mataki 3: Gina WebSocket Sabar
Ƙirƙiri fayil mai suna server.js
kuma rubuta lambar mai zuwa:
// 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);
});
});
Mataki 4: Ƙirƙirar Interface Mai Amfani(Abokin ciniki)
Ƙirƙiri fayil mai suna index.html
kuma rubuta lambar mai zuwa:
<!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>
Mataki na 5: Guda Server da Buɗe Browser
A cikin Terminal, gudanar da umarni mai zuwa don fara WebSocket uwar garken:
node server.js
Bude mai binciken gidan yanar gizo kuma kewaya zuwa " http://localhost:8080 " don amfani da real-time aikace-aikacen taɗi.
Kammalawa
Taya murna! Kun yi nasarar gina real-time aikace-aikacen taɗi ta amfani WebSocket da Node.js. Wannan aikace-aikacen yana ba masu amfani damar yin hulɗa da aika / karɓar saƙonni a cikin real-time. Kuna iya ci gaba da haɓakawa da keɓance wannan aikace-aikacen don ƙirƙirar abubuwa masu ban sha'awa iri-iri!