ভ্রান্ত ধারনা
ওয়েবস্কট এবং সকেট সম্পর্কিত কয়েকটি সাধারণ ভুল ধারণা রয়েছে areআইও:
প্রথম ভ্রান্ত ধারণাটি হ'ল ওয়েব সকেট ব্যবহারের চেয়ে সকেট.আইও ব্যবহার করা উল্লেখযোগ্যভাবে সহজ, যা মনে হয় না। নীচে উদাহরণ দেখুন।
দ্বিতীয় ভ্রান্ত ধারণাটি হ'ল ব্রাউজারগুলিতে ওয়েবস্কট ব্যাপকভাবে সমর্থিত নয়। আরও তথ্যের জন্য নিচে দেখুন।
তৃতীয় ভ্রান্ত ধারণাটি হ'ল সকেট.আইও পুরানো ব্রাউজারগুলিতে ফ্যালব্যাক হিসাবে সংযোগটি হ্রাস করে। এটি প্রকৃতপক্ষে ধরে নেয় যে ব্রাউজারটি পুরানো এবং সার্ভারের সাথে একটি এজেএক্স সংযোগ শুরু করে, যা পরে কিছু ট্র্যাফিক এক্সচেঞ্জ হওয়ার পরে ওয়েবস্কটকে সমর্থনকারী ব্রাউজারগুলিতে আপগ্রেড করা হয়। বিস্তারিত জানার জন্য নীচে দেখুন।
আমার পরীক্ষা
আমি ওয়েবস্কট এবং সকেটের মধ্যে পার্থক্য প্রদর্শনের জন্য একটি এনপিএম মডিউল লিখেছি I
এটি সার্ভার-সাইড এবং ক্লায়েন্ট-সাইড কোডের একটি সাধারণ উদাহরণ - ক্লায়েন্ট ওয়েবস্কট বা সকেট.আইও ব্যবহার করে সার্ভারের সাথে সংযোগ স্থাপন করে এবং সার্ভারটি 1s ব্যবধানে তিনটি বার্তা প্রেরণ করে, যা ক্লায়েন্ট দ্বারা ডিওমে যুক্ত করা হয় are
সার্ভার-সাইড
এক্সপ্রেস.জেএস অ্যাপ্লিকেশনটিতে এটি করতে ওয়েবস্কট এবং সকেট ব্যবহার করার সার্ভার-সাইড উদাহরণের তুলনা করুন: আইওও:
ওয়েবসকেট সার্ভার
এক্সপ্রেস.জেএস ব্যবহার করে ওয়েবসকেট সার্ভারের উদাহরণ:
var path = require('path');
var app = require('express')();
var ws = require('express-ws')(app);
app.get('/', (req, res) => {
console.error('express connection');
res.sendFile(path.join(__dirname, 'ws.html'));
});
app.ws('/', (s, req) => {
console.error('websocket connection');
for (var t = 0; t < 3; t++)
setTimeout(() => s.send('message from server', ()=>{}), 1000*t);
});
app.listen(3001, () => console.error('listening on http://localhost:3001/'));
console.error('websocket example');
সূত্র: https://github.com/rsp/node-websocket-vs-sket.io/blob/master/ws.js
সকেট.আইও সার্ভার
এক্সপ্রেস.জেএস ব্যবহার করে সকেট.আইও সার্ভারের উদাহরণ:
var path = require('path');
var app = require('express')();
var http = require('http').Server(app);
var io = require('socket.io')(http);
app.get('/', (req, res) => {
console.error('express connection');
res.sendFile(path.join(__dirname, 'si.html'));
});
io.on('connection', s => {
console.error('socket.io connection');
for (var t = 0; t < 3; t++)
setTimeout(() => s.emit('message', 'message from server'), 1000*t);
});
http.listen(3002, () => console.error('listening on http://localhost:3002/'));
console.error('socket.io example');
সূত্র: https://github.com/rsp/node-websocket-vs-sket.io/blob/master/si.js
মক্কেলের পক্ষে
ওয়েবসকেট এবং সকেট ব্যবহারের ক্লায়েন্ট-সাইড উদাহরণের সাথে তুলনা করুন I ব্রাউজারে এটি করার জন্য IO:
ওয়েবসকেট ক্লায়েন্ট
ভ্যানিলা জাভাস্ক্রিপ্ট ব্যবহার করে ওয়েবসকেটের ক্লায়েন্টের উদাহরণ:
var l = document.getElementById('l');
var log = function (m) {
var i = document.createElement('li');
i.innerText = new Date().toISOString()+' '+m;
l.appendChild(i);
}
log('opening websocket connection');
var s = new WebSocket('ws://'+window.location.host+'/');
s.addEventListener('error', function (m) { log("error"); });
s.addEventListener('open', function (m) { log("websocket connection open"); });
s.addEventListener('message', function (m) { log(m.data); });
সূত্র: https://github.com/rsp/node-websocket-vs-sket.io/blob/master/ws.html
সকেট.আইও ক্লায়েন্ট
সকেট.আইও ক্লায়েন্ট উদাহরণ ভ্যানিলা জাভাস্ক্রিপ্ট ব্যবহার করে:
var l = document.getElementById('l');
var log = function (m) {
var i = document.createElement('li');
i.innerText = new Date().toISOString()+' '+m;
l.appendChild(i);
}
log('opening socket.io connection');
var s = io();
s.on('connect_error', function (m) { log("error"); });
s.on('connect', function (m) { log("socket.io connection open"); });
s.on('message', function (m) { log(m); });
সূত্র: https://github.com/rsp/node-websocket-vs-sket.io/blob/master/si.html
নেটওয়ার্ক ট্রাফিক
নেটওয়ার্ক ট্র্যাফিকের পার্থক্যটি দেখতে আপনি আমার পরীক্ষা চালাতে পারেন । আমি যে ফলাফল পেয়েছি তা এখানে:
ওয়েবসকেটের ফলাফল
2 টি অনুরোধ, 1.50 কেবি, 0.05 এস
এই 2 টি অনুরোধ থেকে:
- এইচটিএমএল পৃষ্ঠা
- ওয়েবস্কটে সংযোগ আপগ্রেড
(সংযোগ আপগ্রেড অনুরোধটি 101 স্যুইচিং প্রোটোকল প্রতিক্রিয়া সহ বিকাশকারী সরঞ্জামগুলিতে দৃশ্যমান))
সকেট.আইও ফলাফল
6 টি অনুরোধ, 181.56 কেবি, 0.25 এস
এই 6 টি অনুরোধ থেকে:
- এইচটিএমএল পৃষ্ঠা নিজেই
- সকেট.আইওর জাভাস্ক্রিপ্ট (১৮০ কিলোবাইট)
- প্রথম দীর্ঘ পোলিং এজেএক্স অনুরোধ
- দ্বিতীয় দীর্ঘ পোলিং এজেএক্স অনুরোধ
- তৃতীয় দীর্ঘ পোলিং এজেএক্স অনুরোধ
- ওয়েবস্কটে সংযোগ আপগ্রেড
স্ক্রীনশট
আমি লোকহোস্টে পেয়েছি ওয়েবস্কট ফলাফল:
সকেট.আইওর ফলাফল যা আমি লোকালহোস্টে পেয়েছি:
নিজেকে যাচাই করো
দ্রুত শুরু:
# Install:
npm i -g websocket-vs-socket.io
# Run the server:
websocket-vs-socket.io
ওপেন করে http: // স্থানীয় হোস্ট: 3001 / আপনার ব্রাউজারে সঙ্গে + Ctrl + Shift আমি খোলা ডেভেলপার টুলস, নেটওয়ার্ক ট্যাব খুলুন এবং WebSocket এর সংস্করণের জন্য নেটওয়ার্ক ট্রাফিক দেখতে সঙ্গে জন্য Ctrl + আর পৃষ্ঠাটি পুনরায় লোড।
ওপেন করে http: // স্থানীয় হোস্ট: 3002 / আপনার ব্রাউজারে সঙ্গে + Ctrl + Shift আমি খোলা ডেভেলপার টুলস, নেটওয়ার্ক ট্যাব খুলুন এবং Socket.IO সংস্করণের জন্য নেটওয়ার্ক ট্রাফিক দেখতে সঙ্গে জন্য Ctrl + আর পৃষ্ঠাটি পুনরায় লোড।
আনইনস্টল করতে:
# Uninstall:
npm rm -g websocket-vs-socket.io
ব্রাউজার সামঞ্জস্য
জুন ২০১ 2016 পর্যন্ত ওয়েবসকেট অপেরা মিনি ব্যতীত অন্য 9 টিরও বেশি IE সহ কাজ করে।
এটি আমি জুন ২০১ 2016- তে ব্যবহার করতে পারি ওয়েব- সকেটের ব্রাউজারের সামঞ্জস্যতা :
আপ-টু-ডেট তথ্যের জন্য http://caniuse.com/websocket দেখুন ।