ওয়েব সকেট প্রবর্তন - ওয়েবে সকেট আনা

ইজি কিতামুরা
Malte Ubl

সমস্যা: কম লেটেন্সি ক্লায়েন্ট-সার্ভার এবং সার্ভার-ক্লায়েন্ট সংযোগ

ওয়েবটি মূলত HTTP-এর তথাকথিত অনুরোধ/প্রতিক্রিয়া দৃষ্টান্তকে ঘিরে তৈরি করা হয়েছে। একটি ক্লায়েন্ট একটি ওয়েব পৃষ্ঠা লোড করে এবং তারপর ব্যবহারকারী পরবর্তী পৃষ্ঠায় ক্লিক না করা পর্যন্ত কিছুই ঘটে না। 2005 সালের দিকে, AJAX ওয়েবকে আরও গতিশীল মনে করতে শুরু করে। তবুও, সমস্ত HTTP যোগাযোগ ক্লায়েন্ট দ্বারা পরিচালিত হয়েছিল, যার জন্য সার্ভার থেকে নতুন ডেটা লোড করার জন্য ব্যবহারকারীর মিথস্ক্রিয়া বা পর্যায়ক্রমিক পোলিং প্রয়োজন।

প্রযুক্তিগুলি যেগুলি সার্ভারকে ক্লায়েন্টের কাছে ডেটা পাঠাতে সক্ষম করে যখন এটি জানে যে নতুন ডেটা উপলব্ধ রয়েছে বেশ কিছুদিন ধরে। এরা 'পুশ' বা 'ধূমকেতু' নামে পরিচিত। একটি সার্ভার সূচিত সংযোগের বিভ্রম তৈরি করার জন্য সবচেয়ে সাধারণ হ্যাকগুলির মধ্যে একটিকে দীর্ঘ পোলিং বলা হয়। দীর্ঘ ভোটের মাধ্যমে, ক্লায়েন্ট সার্ভারে একটি HTTP সংযোগ খোলে যা প্রতিক্রিয়া পাঠানো পর্যন্ত এটি খোলা থাকে। যখনই সার্ভারে নতুন ডেটা থাকে তখনই এটি প্রতিক্রিয়া পাঠায় (অন্যান্য কৌশলগুলির মধ্যে রয়েছে Flash , XHR মাল্টিপার্ট অনুরোধ এবং তথাকথিত htmlfiles )। দীর্ঘ ভোটগ্রহণ এবং অন্যান্য কৌশল বেশ ভাল কাজ করে। আপনি এগুলি প্রতিদিন GMail চ্যাটের মতো অ্যাপ্লিকেশনগুলিতে ব্যবহার করেন৷

যাইহোক, এই সমস্ত কাজের মধ্যে একটি সমস্যা রয়েছে: তারা HTTP-এর ওভারহেড বহন করে, যা তাদের কম লেটেন্সি অ্যাপ্লিকেশনের জন্য উপযুক্ত করে না। ব্রাউজারে মাল্টিপ্লেয়ার ফার্স্ট পার্সন শ্যুটার গেম বা রিয়েলটাইম কম্পোনেন্ট সহ অন্য কোনো অনলাইন গেমের কথা ভাবুন।

ওয়েবসকেট প্রবর্তন: ওয়েবে সকেট আনা

WebSocket স্পেসিফিকেশন একটি API সংজ্ঞায়িত করে যা একটি ওয়েব ব্রাউজার এবং একটি সার্ভারের মধ্যে "সকেট" সংযোগ স্থাপন করে। সহজ কথায়: ক্লায়েন্ট এবং সার্ভারের মধ্যে একটি অবিরাম সংযোগ রয়েছে এবং উভয় পক্ষই যেকোনো সময় ডেটা পাঠানো শুরু করতে পারে।

শুরু হচ্ছে

আপনি WebSocket কনস্ট্রাক্টরকে কল করে একটি WebSocket সংযোগ খুলবেন:

var connection = new WebSocket('ws://html5rocks.websocket.org/echo', ['soap', 'xmpp']);

ws: . এটি WebSocket সংযোগের জন্য নতুন URL স্কিমা। এছাড়াও রয়েছে wss: নিরাপদ WebSocket সংযোগের জন্য একইভাবে https: নিরাপদ HTTP সংযোগের জন্য ব্যবহৃত হয়।

সংযোগে অবিলম্বে কিছু ইভেন্ট হ্যান্ডলার সংযুক্ত করার ফলে আপনি জানতে পারবেন কখন সংযোগটি খোলা হয়, আগত বার্তা পাওয়া যায় বা কোনো ত্রুটি আছে।

দ্বিতীয় যুক্তি ঐচ্ছিক সাব-প্রোটোকল গ্রহণ করে। এটি একটি স্ট্রিং বা স্ট্রিং একটি অ্যারে হতে পারে. প্রতিটি স্ট্রিং একটি সাব-প্রটোকল নামের প্রতিনিধিত্ব করা উচিত এবং সার্ভার অ্যারেতে পাস করা সাব-প্রোটোকলগুলির মধ্যে একটি গ্রহণ করে। WebSocket অবজেক্টের protocol প্রপার্টি অ্যাক্সেস করে গৃহীত সাব-প্রোটোকল নির্ধারণ করা যেতে পারে।

সাব-প্রোটোকল নামগুলি অবশ্যই IANA রেজিস্ট্রিতে নিবন্ধিত সাব-প্রোটোকল নামের একটি হতে হবে৷ ফেব্রুয়ারী 2012 হিসাবে বর্তমানে শুধুমাত্র একটি উপ-প্রোটোকল নাম (সাবান) নিবন্ধিত আছে।

// When the connection is open, send some data to the server
connection.onopen = function () {
connection.send('Ping'); // Send the message 'Ping' to the server
};

// Log errors
connection.onerror = function (error) {
console.log('WebSocket Error ' + error);
};

// Log messages from the server
connection.onmessage = function (e) {
console.log('Server: ' + e.data);
};

সার্ভারের সাথে যোগাযোগ

সার্ভারের সাথে আমাদের সংযোগ পাওয়ার সাথে সাথে (যখন open ইভেন্টটি গুলি করা হয়) আমরা সংযোগ অবজেক্টে send('your message') পদ্ধতি ব্যবহার করে সার্ভারে ডেটা পাঠানো শুরু করতে পারি। এটি শুধুমাত্র স্ট্রিংগুলিকে সমর্থন করত, কিন্তু সর্বশেষ বৈশিষ্ট্যে এটি এখন বাইনারি বার্তাও পাঠাতে পারে। বাইনারি ডেটা পাঠাতে, আপনি Blob বা ArrayBuffer অবজেক্ট ব্যবহার করতে পারেন।

// Sending String
connection.send('your message');

// Sending canvas ImageData as ArrayBuffer
var img = canvas_context.getImageData(0, 0, 400, 320);
var binary = new Uint8Array(img.data.length);
for (var i = 0; i < img.data.length; i++) {
binary[i] = img.data[i];
}
connection.send(binary.buffer);

// Sending file as Blob
var file = document.querySelector('input[type="file"]').files[0];
connection.send(file);

একইভাবে সার্ভার আমাদের যেকোনো সময় বার্তা পাঠাতে পারে। যখনই এটি ঘটে onmessage কলব্যাক ফায়ার। কলব্যাক একটি ইভেন্ট অবজেক্ট গ্রহণ করে এবং প্রকৃত বার্তাটি data সম্পত্তির মাধ্যমে অ্যাক্সেসযোগ্য।

WebSocket সর্বশেষ বৈশিষ্ট্যে বাইনারি বার্তাও পেতে পারে। বাইনারি ফ্রেমগুলি Blob বা ArrayBuffer ফরম্যাটে পাওয়া যেতে পারে। প্রাপ্ত বাইনারিটির বিন্যাস নির্দিষ্ট করতে, WebSocket অবজেক্টের বাইনারি টাইপ বৈশিষ্ট্যকে 'ব্লব' বা 'অ্যারেবাফার'-এ সেট করুন। ডিফল্ট বিন্যাস হল 'ব্লব'। (আপনাকে পাঠানোর সময় বাইনারি টাইপ প্যারাম সারিবদ্ধ করতে হবে না।)

// Setting binaryType to accept received binary as either 'blob' or 'arraybuffer'
connection.binaryType = 'arraybuffer';
connection.onmessage = function(e) {
console.log(e.data.byteLength); // ArrayBuffer object if binary
};

WebSocket এর আরেকটি নতুন যোগ করা বৈশিষ্ট্য হল এক্সটেনশন। এক্সটেনশন ব্যবহার করে, ফ্রেম সংকুচিত , মাল্টিপ্লেক্সড ইত্যাদি পাঠানো সম্ভব হবে। খোলা ইভেন্টের পরে ওয়েবসকেট অবজেক্টের এক্সটেনশন বৈশিষ্ট্য পরীক্ষা করে আপনি সার্ভারে গৃহীত এক্সটেনশনগুলি খুঁজে পেতে পারেন। ফেব্রুয়ারী 2012 পর্যন্ত আনুষ্ঠানিকভাবে প্রকাশিত এক্সটেনশনের স্পেস নেই।

// Determining accepted extensions
console.log(connection.extensions);

ক্রস-অরিজিন যোগাযোগ

একটি আধুনিক প্রোটোকল হওয়ায়, ক্রস অরিজিন যোগাযোগ সরাসরি WebSocket-এ বেক করা হয়। যদিও আপনার এখনও নিশ্চিত হওয়া উচিত শুধুমাত্র আপনার বিশ্বাসযোগ্য ক্লায়েন্ট এবং সার্ভারের সাথে যোগাযোগ করা, WebSocket যেকোনো ডোমেনে পক্ষগুলির মধ্যে যোগাযোগ সক্ষম করে। সার্ভার সিদ্ধান্ত নেয় যে তার পরিষেবাটি সমস্ত ক্লায়েন্টদের জন্য উপলব্ধ করা হবে নাকি শুধুমাত্র তাদের জন্য যারা ভালভাবে সংজ্ঞায়িত ডোমেনের সেটে থাকে৷

প্রক্সি সার্ভার

প্রতিটি নতুন প্রযুক্তি নতুন সমস্যা নিয়ে আসে। ওয়েবসকেটের ক্ষেত্রে এটি প্রক্সি সার্ভারের সাথে সামঞ্জস্যপূর্ণ যা বেশিরভাগ কোম্পানির নেটওয়ার্কে HTTP সংযোগের মধ্যস্থতা করে। WebSocket প্রোটোকল HTTP আপগ্রেড সিস্টেম ব্যবহার করে (যা সাধারণত HTTP/SSL এর জন্য ব্যবহৃত হয়) একটি WebSocket সংযোগে একটি HTTP সংযোগকে 'আপগ্রেড' করতে। কিছু প্রক্সি সার্ভার এটি পছন্দ করে না এবং সংযোগটি ছেড়ে দেবে। এইভাবে, এমনকি যদি একটি প্রদত্ত ক্লায়েন্ট WebSocket প্রোটোকল ব্যবহার করে, এটি একটি সংযোগ স্থাপন করা সম্ভব নাও হতে পারে। এটি পরবর্তী বিভাগটিকে আরও গুরুত্বপূর্ণ করে তোলে :)

আজই WebSockets ব্যবহার করুন

ওয়েবসকেট এখনও একটি তরুণ প্রযুক্তি এবং সমস্ত ব্রাউজারে সম্পূর্ণরূপে প্রয়োগ করা হয়নি। যাইহোক, আপনি আজই লাইব্রেরিগুলির সাথে WebSocket ব্যবহার করতে পারেন যেগুলি উপরে উল্লিখিত ফলব্যাকগুলির একটি ব্যবহার করে যখনই WebSocket উপলব্ধ না থাকে৷ একটি লাইব্রেরি যা এই ডোমেনে খুব জনপ্রিয় হয়ে উঠেছে তা হল socket.io যা একটি ক্লায়েন্ট এবং প্রোটোকলের একটি সার্ভার বাস্তবায়নের সাথে আসে এবং এতে ফলব্যাক অন্তর্ভুক্ত থাকে (socket.io এখনও ফেব্রুয়ারী 2012 পর্যন্ত বাইনারি মেসেজিং সমর্থন করে না)। PusherApp- এর মতো বাণিজ্যিক সমাধানও রয়েছে যা ক্লায়েন্টদের কাছে WebSocket বার্তা পাঠানোর জন্য HTTP API প্রদান করে যেকোনো ওয়েব পরিবেশে সহজেই একীভূত করা যায়। অতিরিক্ত HTTP অনুরোধের কারণে বিশুদ্ধ ওয়েবসকেটের তুলনায় সর্বদা অতিরিক্ত ওভারহেড থাকবে।

সার্ভার সাইড

WebSocket ব্যবহার করে সার্ভার সাইড অ্যাপ্লিকেশনের জন্য একটি সম্পূর্ণ নতুন ব্যবহার প্যাটার্ন তৈরি করে। যদিও LAMP-এর মতো প্রথাগত সার্ভার স্ট্যাকগুলি HTTP অনুরোধ/প্রতিক্রিয়া চক্রের চারপাশে ডিজাইন করা হয়েছে তারা প্রায়শই প্রচুর সংখ্যক খোলা ওয়েবসকেট সংযোগের সাথে ভালভাবে কাজ করে না। একই সময়ে প্রচুর সংখ্যক সংযোগ খোলা রাখার জন্য একটি আর্কিটেকচারের প্রয়োজন যা কম কর্মক্ষমতা খরচে উচ্চ সমঝোতা পায়। এই ধরনের আর্কিটেকচারগুলি সাধারণত হয় থ্রেডিং বা তথাকথিত নন-ব্লকিং IO এর চারপাশে ডিজাইন করা হয়।

সার্ভার সাইড বাস্তবায়ন

প্রোটোকল সংস্করণ

ওয়েবসকেটের জন্য ওয়্যার প্রোটোকল (একটি হ্যান্ডশেক এবং ক্লায়েন্ট এবং সার্ভারের মধ্যে ডেটা স্থানান্তর) এখন RFC6455 । অ্যান্ড্রয়েডের জন্য সর্বশেষ ক্রোম এবং ক্রোম বাইনারি মেসেজিং সহ RFC6455 এর সাথে সম্পূর্ণ সামঞ্জস্যপূর্ণ। এছাড়াও, Firefox সংস্করণ 11-এ, Internet Explorer সংস্করণ 10-এ সামঞ্জস্যপূর্ণ হবে। আপনি এখনও পুরানো প্রোটোকল সংস্করণগুলি ব্যবহার করতে পারেন তবে এটি সুপারিশ করা হয় না যেহেতু তারা দুর্বল বলে পরিচিত। ওয়েবসকেট প্রোটোকলের পুরানো সংস্করণগুলির জন্য আপনার সার্ভার বাস্তবায়ন থাকলে, আমরা আপনাকে এটিকে সর্বশেষ সংস্করণে আপগ্রেড করার পরামর্শ দিই।

ব্যবহারের ক্ষেত্রে

যখনই আপনার ক্লায়েন্ট এবং সার্ভারের মধ্যে রিয়েলটাইম সংযোগের কাছাকাছি, সত্যিকারের কম বিলম্বের প্রয়োজন হয় তখন WebSocket ব্যবহার করুন৷ মনে রাখবেন যে ইভেন্ট সারিগুলির মতো প্রযুক্তিগুলিতে একটি নতুন ফোকাস সহ আপনি কীভাবে আপনার সার্ভার সাইড অ্যাপ্লিকেশনগুলি তৈরি করবেন তা পুনর্বিবেচনা করতে পারে৷ কিছু উদাহরণ ব্যবহারের ক্ষেত্রে হল:

  • মাল্টিপ্লেয়ার অনলাইন গেম
  • চ্যাট অ্যাপ্লিকেশন
  • লাইভ স্পোর্টস টিকার
  • রিয়েলটাইম আপডেট করা সামাজিক স্ট্রীম

ডেমো

তথ্যসূত্র