✊🏼 👩🏼‍💻 🚔 Node.JS पर उन्नत चैट 🥙 🎓 👨🏾‍🤝‍👨🏽

हां, इंटरनेट बैटल चैट कार्यान्वयन से भरा है, लेकिन फिर भी, मैं उन्हें पसंद नहीं करता। मैं आपको लाठी के साथ अपने चैट कार्यान्वयन को प्रस्तुत करता हूं, और आप खुद जानते हैं कि क्या है।

तो, तुरंत अधीर के लिए एक डेमो का लिंक ।
(सर्वर पहले से ही संग्रहीत)

विशेषताएं

डेटाबेस में संदेश सहेजना
प्राधिकरण
चैट कमांड्स
WebSocket के माध्यम से सर्वर से कनेक्शन

यह कैसे काम करता है

खैर, सब कुछ सरल है

कैसे करना है?

निर्भरता स्थापना

sudo yum install nodejs sudo yum install mongodb npm install ws npm install mongodb

प्रोग्राम

सबसे पहले, हम क्लाइंट को एक हिस्सा बनाते हैं, जबकि नोड.जेएस और सर्वर एक के लिए आवश्यक सब कुछ स्थापित होता है।

HTML बहुत संक्षिप्त है

 <!DOCTYPE html> <html> <head> <link href='http://fonts.googleapis.com/css?family=Ubuntu&subset=latin,cyrillic' rel='stylesheet' type='text/css'> <link href="main.css" rel="stylesheet" /> <script src="main.js" defer></script> <meta charset="UTF-8"> </head> <body> <form id="loginform" class="unauthorized"> <input id="login" placeholder=""><br> <input id="password" placeholder=""> <div>*    ,   </div> </form> <output id="messages"></output> <div> <div contenteditable id="input"></div> </div> </body> </html>

script टैग की defer विशेषता के लिए धन्यवाद, जावास्क्रिप्ट केवल पूरे पृष्ठ को लोड करने के बाद शुरू होगा। यह window.onload इवेंट की तुलना में बहुत अधिक सुविधाजनक है।

कोड को कम करने के लिए, document.getElementById को $ कम document.getElementById

 function $(a){return document.getElementById(a)}

सर्वर से कनेक्शन खोलें और आने वाले संदेशों की प्रतीक्षा करें

 ws = new WebSocket ('ws://x.cloudx.cx:9000'); ws.onmessage = function (message) { //        var event = JSON.parse(message.data); //     ,   switch (event.type) { case 'message': //    var name = document.createElement('div'); var icon = document.createElement('div'); var body = document.createElement('div'); var root = document.createElement('div'); name.innerText = event.from; body.innerText = specials_in(event); root.appendChild(name); root.appendChild(icon); root.appendChild(body); $('messages').appendChild (root); break; case 'authorize': //      if (event.success) { $('loginform').classList.remove('unauthorized'); } break; default: //   ,       console.log ('unknown event:', event) break; } }

आपने देखा होगा कि इनकमिंग मैसेज सबसे पहले specials_in फ़ंक्शन द्वारा संसाधित किए जाते specials_in । यह फ़ंक्शन संदेश बॉडी में विशेष अंशों की खोज करता है जो चैट कार्यक्षमता का विस्तार करते हैं।

 function specials_in (event) { var message = event.message; var moment = new Date(event.time); //      var time = (moment.getHours()<10)? '0'+moment.getHours() : moment.getHours(); time = (moment.getMinutes()<10)? time+':0'+moment.getMinutes() : time+':'+moment.getMinutes(); time = (moment.getSeconds()<10)? time+':0'+moment.getSeconds() : time+':'+moment.getSeconds(); var date = (moment.getDate()<10)? '0'+moment.getDate() : moment.getDate(); date = (moment.getMonth()<10)? date+'.0'+moment.getMinutes()+'.'+moment.getFullYear() : date+':'+moment.getMonth()+'.'+moment.getFullYear() message = message.replace(/\[time\]/gim, time); message = message.replace(/\[date\]/gim, date); return message; }

आउटगोइंग संदेशों के लिए एक समान सुविधा

 function specials_out(message) { // /me message = message.replace(/\s*\/me\s/, $('login').value+' '); return message; }

क्लाइंट साइड कोड के बाकी, असामान्य कुछ भी नहीं है

 //   Enter     $('password').onkeydown = function (e) { if (e.which == 13) { //    authorize ws.send (JSON.stringify ({ type: 'authorize', user: $('login').value, password: $('password').value })); } } //   Enter     $('input').onkeydown = function (e) { //    Ctrl+Enter  Shift+Enter,     . if (e.which == 13 && !e.ctrlKey && !e.shiftKey) { //    message ws.send (JSON.stringify ({ type: 'message', message: specials_out($('input').innerText) })); $('input').innerText = ''; //    } } //      var observer = new MutationObserver(function(mutations) { mutations.forEach(function(mutation) { var objDiv = $('messages'); objDiv.scrollTop = objDiv.scrollHeight; }); }).observe($('messages'), { childList: true });

अब सर्वर साइड में आते हैं

डेटाबेस से कनेक्ट करें और पोर्ट 9000 पर वेब सॉकेट पर कनेक्शन की प्रतीक्षा करें

 //   var WebSocketServer = require('ws').Server, wss = new WebSocketServer({port: 9000}); //    var MongoClient = require('mongodb').MongoClient, format = require('util').format; var userListDB, chatDB; //    MongoClient.connect('mongodb://127.0.0.1:27017', function (err, db) { if (err) {throw err} //     ()    userListDB = db.collection('users'); chatDB = db.collection('chat'); });

प्राधिकरण और पंजीकरण उपयोगकर्ता के लिए यथासंभव सरल बनाये जाते हैं। यदि कोई खाता नहीं है, तो यह बनाया जाएगा।

 //         function existUser (user, callback) { userListDB.find({login: user}).toArray(function (error, list) { callback (list.length !== 0); }); } //         function checkUser (user, password, callback) { // ,     existUser(user, function (exist) { //    if (exist) { //        userListDB.find({login: user}).toArray(function (error, list) { //   callback (list.pop().password === password); }); } else { //   ,    userListDB.insert ({login: user, password: password}, {w:1}, function (err) { if (err) {throw err} }); //   ,   callback (true); } }); }

सभी चैट प्रतिभागियों को संदेश भेजना
इस समारोह में काम करने के लिए, प्रत्येक भागीदार के साथ कनेक्शन के लिंक peers सरणी में हैं

 //     function broadcast (by, message) { //   ,     var time = new Date().getTime(); //     peers.forEach (function (ws) { ws.send (JSON.stringify ({ type: 'message', message: message, from: by, time: time })); }); //     chatDB.insert ({message: message, from: by, time: time}, {w:1}, function (err) { if (err) {throw err} }); }

नए कनेक्शन और संदेश संभालना

 //    wss.on('connection', function (ws) { //   var login = ''; var registered = false; //    ws.on('message', function (message) { //      var event = JSON.parse(message); //    ,    if (event.type === 'authorize') { //   checkUser(event.user, event.password, function (success) { //        registered = success; //    var returning = {type:'authorize', success: success}; //  ,  if (success) { //        returning.online = lpeers; //        lpeers.push (event.user); //        peers.push (ws); //        login = event.user; //    ws.on ('close', function () { peers.exterminate(ws); lpeers.exterminate(login); }); } //  , ,   ws.send (JSON.stringify(returning)); //      if (success) { sendNewMessages(ws); } }); } else { //    ,    if (registered) { //    switch (event.type) { //    case 'message': //    broadcast (login, event.message) break; //    ,     case 'type': //     ,      break; } } } }); });

काम करने के लिए उपरोक्त कोड के लिए, आपको इतिहास से संदेश प्राप्त करने के कार्य की आवश्यकता होगी, ऑनलाइन लोगों की सूची और सरणी से किसी तत्व को हटाने का कार्य करना होगा।

 //    ( ) var lpeers = []; //        function sendNewMessages (ws) { chatDB.find().toArray(function(error, entries) { if (error) {throw error} entries.forEach(function (entry){ entry.type = 'message'; ws.send (JSON.stringify (entry)); }); }); } //        Array.prototype.exterminate = function (value) { this.splice(this.indexOf(value), 1); }

चाट तैयार है!

यहां से सूत्र लिए जा सकते हैं
(सर्वर नियमित रूप से पड़ा हुआ है)

चला सकते हैं

 su - mongod --smallfiles > /dev/null & node path/to/server.js > /dev/null &

यह करें

बाढ़ से बचाव
अधिक चैट कमांड और विशेष स्निपेट
अवतारों को डाउनलोड करें
ध्वनि सूचनाएं
"कमरे"
संदेश हटाएं
चित्र, ऑडियो और वीडियो भेजें