রুবিতে পুশ এবং পাব/সাব

অ্যাকশন ক্যাবলের মতো লাইব্রেরিগুলির সাথে রেলে রিয়েল টাইম বৈশিষ্ট্যগুলি তৈরি করা অনেক সহজ হয়েছে৷ অ্যাপসিগন্যাল একাডেমির এই পর্বে, আমরা একটি ন্যূনতম ওয়েবসকেট সার্ভার তৈরির সাথে বাস্তব সময়ের আপডেটে ডুব দেব এবং এটি কীভাবে কাজ করে তা দেখার জন্য।

আমরা একটি অ্যাপ্লিকেশন তৈরি করব যা পুশ করে ডেটা, এবং পাব/সাব ব্যবহার করে একটি ওয়েবসকেটের উপর . আমরা কোড শুরু করার আগে, আসুন প্রথমে এই তিনটি ধারণার অর্থ কী তা কভার করে একটু সময় ব্যয় করি:

ধাক্কা সেই ডেটার জন্য রিসিভার পোল করার পরিবর্তে একটি রিসিভারের কাছে ডেটা পুশ করা বোঝায়। স্টকের দাম, চ্যাট অ্যাপ্লিকেশন, বা অপারেশন কনসোলগুলির মতো রিয়েলটাইম আপডেটে অবশ্যই থাকতে হবে৷
পাব/সাব৷ বা প্রকাশ এবং সদস্যতা হল 1990 এর দশকে ওয়াল স্ট্রিটে TIBCO দ্বারা জনপ্রিয় ডেটা পুশ করার জন্য একটি মিথস্ক্রিয়া মডেল। একজন রিসিভার একটি বিষয় সাবস্ক্রাইব করে এবং একজন প্রকাশকের জন্য সেই বিষয়ে ডেটা পুশ করার জন্য অপেক্ষা করে। একজন শ্রোতার সাথে প্রকাশিত বার্তার সাথে মিলের জন্য ওয়াইল্ডকার্ড প্যাটার্নের মিল অন্তর্ভুক্ত করা সাধারণ, যদিও কিছু সহজ বাস্তবায়ন বিষয়ের ওয়াইল্ডকার্ডের পরিবর্তে শুধুমাত্র নামযুক্ত চ্যানেল ব্যবহার করে। আমি সেই প্রারম্ভিক দিনগুলিতে TIBCO-তে শুরু করেছিলাম তাই আমি ওয়াইল্ডকার্ড প্যাটার্ন ম্যাচিং এর নমনীয়তা পছন্দ করি৷
ওয়েবসকেট তথ্য বিনিময়ের জন্য একটি প্রোটোকল - সাধারণত একটি ওয়েব ব্রাউজার এবং একটি অ্যাপ্লিকেশনের মধ্যে। একটি HTTP সংযোগ একটি WebSocket সংযোগে আপগ্রেড করা হয় এবং তারপরে দুটি প্রান্তের মধ্যে উভয় উপায়ে ডেটা পাঠানো যেতে পারে। ওয়েবসকেটগুলি একটি অ্যাপ্লিকেশন থেকে ব্রাউজারে ডেটা পুশ করতে পারে। এটি ব্রাউজারে আপনার JavaScript কোড থেকে অ্যাপ্লিকেশনে ডেটা পাঠানোর জন্য একটি POST বা PUT ছাড়া অন্য একটি প্রক্রিয়াও প্রদান করে। বেশ সুন্দর, হাহ?

আন্ডার দ্য হুড

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

var sock = new WebSocket("ws://" + document.URL.split("/")[2] + "/upgrade");

সার্ভারটি একটি সূচক সহ একটি HTTP অনুরোধ পায় যে একটি আপগ্রেডের অনুরোধ করা হয়েছিল৷ সাধারণত, সার্ভার একটি অ্যাপ্লিকেশনকে আপগ্রেড করা বা না করার সিদ্ধান্ত নিতে দেয়। এটি কীভাবে করে তা অ্যাপে প্রদত্ত API এর উপর নির্ভর করে। র্যাককে সমর্থন করে এমন একটি সার্ভার সকেটটিকে হাইজ্যাক করার এবং বিকাশকারীকে সমস্ত প্রোটোকল বিবরণ পরিচালনা করতে দেয় বা প্রস্তাবিত পিআর অনুসারে, আপগ্রেড করার জন্য একটি প্রতিক্রিয়া যথেষ্ট।

আপগ্রেড হল সার্ভার এবং ক্লায়েন্টের মধ্যে বিনিময়ের একটি সেট। সমস্ত ব্রাউজার এবং কিছু সার্ভার রত্ন এই বিবরণ লুকান. সংযোগ স্থাপন হয়ে গেলে, WebSocket প্রোটোকল অনুসরণ করে বার্তা আদান-প্রদান করা যেতে পারে।

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

ডাইভিং ইন

আমরা একটি ঘড়ির থ্রেডের উদাহরণ ব্যবহার করব যা সমস্ত শ্রোতা ক্লায়েন্টদের বর্তমান সময় প্রকাশ করতে শুরু করেছে। আমরা আমাদের সার্ভার তৈরি করতে Agoo ব্যবহার করব কারণ এটি দ্রুত এবং জটিলতাকে ন্যূনতম রাখে৷

আমরা একটি এইচটিএমএল পৃষ্ঠায় বর্তমান সময় দেখিয়ে ক্লায়েন্ট হিসাবে কিছু জাভাস্ক্রিপ্ট দিয়ে শুরু করব। একটি নতুন WebSocket তৈরি করার পরে একটি onopen কলব্যাক সেট করা হয় যা স্থিতি HTML উপাদান পরিবর্তন করে। onmessage কলব্যাক message আপডেট করে এইচটিএমএল উপাদান। প্রকাশ এবং সাবস্ক্রাইব এক্সচেঞ্জের মতো অ্যাসিঙ্ক্রোনাস কলগুলির সাথে কাজ করার সময় কলব্যাকগুলি একটি সাধারণ নকশার প্যাটার্ন৷

<!-- websocket.html -->
<html>
  <body>
    <p id="status">...</p>
    <p id="message">... waiting ...</p>
 
    <script type="text/javascript">
      var sock = new WebSocket(
        "ws://" + document.URL.split("/")[2] + "/upgrade"
      );
      sock.onopen = function () {
        document.getElementById("status").textContent = "connected";
      };
      sock.onmessage = function (msg) {
        document.getElementById("message").textContent = msg.data;
      };
    </script>
  </body>
</html>

আমাদের ক্লায়েন্ট সম্পন্ন হলে, আসুন সার্ভারটি বাস্তবায়ন করি, যা Rack API ব্যবহার করে একটি রুবি অ্যাপ্লিকেশন। Clock /upgrade-এ সমস্ত HTTP অনুরোধের জন্য ক্লাস নিজেই হ্যান্ডলার হবে পথ যদি অনুরোধটি একটি আপগ্রেডের জন্য হয় তবে আমরা কেবল 200-এর একটি HTTP স্ট্যাটাস কোড দিয়ে সাফল্য ফেরত দিই, অন্যথায়, আমরা পেজ নট ফাউন্ডের জন্য একটি 404 ফেরত দিই। #call এর একমাত্র অন্য ধাপ পদ্ধতি হল WebSocket হ্যান্ডলারের অ্যাসাইনমেন্ট।

class Clock
  def self.call(env)
    unless env['rack.upgrade?'].nil?
      env['rack.upgrade'] = Clock
      [ 200, { }, [ ] ]
    else
      [ 404, { }, [ ] ]
    end
  end
end

API কলব্যাকের উপর ভিত্তি করে। আমাদের সার্ভারের জন্য আমরা যে কলব্যাকের যত্ন নিই তা হল #on_open কলব্যাক যা আমাদের "সময়" বিষয়ের সদস্যতা তৈরি করতে সক্ষম করে। বিষয় বা বিষয় দ্বারা চিহ্নিত চ্যানেলের মাধ্যমে বার্তা আদান-প্রদান করা হয়। #on_open যখন একটি ওয়েব সকেট সংযোগ স্থাপন করা হয় তখন বলা হয়৷

class Clock
  # ...
 
  def self.on_open(client)
    client.subscribe('time')
  end
end

এখন, একটি থ্রেড দিয়ে প্রকাশ করা শুরু করা যাক যা প্রতি সেকেন্ডের পর সময় প্রকাশ করে। Agoo.publish-এ কল "সময়" বিষয়ে একটি বার্তা পাঠায়, তারপর সমস্ত গ্রাহক বার্তাটি গ্রহণ করে। সার্ভার সাবস্ক্রিপশন এবং সংযোগের ট্র্যাক রাখে এবং জাভাস্ক্রিপ্ট ক্লায়েন্টের কাছে বার্তা সরবরাহ করে যা HTML উপাদান আপডেট করে।

require 'agoo'
 
Thread.new {
  loop do
    now = Time.now
    Agoo.publish('time', "%02d:%02d:%02d" % [now.hour, now.min, now.sec])
    sleep(1)
  end
}

শুধুমাত্র অন্য কোডের প্রয়োজন হল সেই কোড যা সার্ভার শুরু করে এবং শুরু করে। Agoo::Server.handle(:GET, '/upgrade', Clock) এ কল সার্ভারকে /upgrade-এ HTTP GET অনুরোধ শুনতে বলে URL পাথ এবং সেই অনুরোধগুলিকে Clock-এ পাঠাতে ক্লাস এটি উন্নত কর্মক্ষমতা এবং নমনীয়তার জন্য রুবির বাইরে রাউটিং ঘটতে দেয়৷

Agoo::Server.init(6464, '.', thread_count: 0)
Agoo::Server.handle(:GET, '/upgrade', Clock)
Agoo::Server.start

আমরা প্রায় সেখানে. এই কমান্ড দিয়ে সার্ভার চালান।

$ ruby pubsub.rb

একটি লগ এন্ট্রি নিচের মত কিছু দেখানো উচিত, যা নির্দেশ করে যে সার্ভার চলছে এবং পোর্ট 6464 এ শুনছে।

I 2018/08/14 19:49:45.170618000 INFO: Agoo 2.5.0 with pid 40366 is listening on https://:6464.

এটি কাজ করছে কিনা তা দেখার সময়

আসুন https://localhost:6464/websocket.html খুলি। একটি সংযোগ স্থাপন করা হলে একটি প্রাথমিক ফ্লিকারের পরে, সংযোগের অবস্থা এবং সময় প্রদর্শন করা উচিত। ঘড়ির কাঁটা যত বাড়বে প্রতি সেকেন্ডে সময় বাড়বে।

connected

19:50:12

একটি প্রকাশ করার জন্য অভিনন্দন এবং ওয়েব অ্যাপ্লিকেশন সাবস্ক্রাইব করার জন্য;-)

আজকের পর্বে, আমরা WebSocket ব্যবহার করে দেখেছি। সার্ভার সাইড ইভেন্টস (SSE) একই কাজ করার আরেকটি বিকল্প অফার করে এবং আমরা সম্পূর্ণ সোর্স কোড উদাহরণে SSE অন্তর্ভুক্ত করেছি। আপনি যদি আরও জানতে চান, তাহলে আমরা যে Agoo সার্ভার ব্যবহার করেছি বা আয়োডিন ওয়েবসকেট সার্ভার তা একবার দেখুন৷

যদি আপনার কোন প্রশ্ন বা মন্তব্য থাকে, তাহলে আমাদের একটি লাইন @AppSignal ড্রপ করতে দ্বিধা করবেন না।