একটি ডিভাইস অ্যাক্সেস ওয়েব অ্যাপ্লিকেশন নির্মাণ

1. ভূমিকা

ডিভাইস অ্যাক্সেস প্রোগ্রাম স্মার্ট ডিভাইস ম্যানেজমেন্ট API প্রদান করে, যা ডেভেলপারদের তাদের অ্যাপ্লিকেশন থেকে Google Nest ডিভাইসগুলি নিয়ন্ত্রণ করার জন্য একটি REST API। ব্যবহারকারীদের তাদের Nest ডিভাইসগুলিতে তৃতীয় পক্ষের অ্যাক্সেসের জন্য সম্মতি দিতে হবে।

একটি সফল ডিভাইস অ্যাক্সেস ইন্টিগ্রেশনের জন্য তিনটি মূল ধাপ রয়েছে:

1. প্রকল্প তৈরি - গুগল ক্লাউড প্ল্যাটফর্মে একটি প্রকল্প তৈরি করুন এবং ডিভাইস অ্যাক্সেস কনসোলে ডেভেলপার হিসেবে সাইন আপ করুন।
2. অ্যাকাউন্ট লিঙ্কিং - ব্যবহারকারীদের অ্যাকাউন্ট লিঙ্কিং প্রবাহের মাধ্যমে পান এবং একটি অ্যাক্সেস কোড পুনরুদ্ধার করুন। একটি অ্যাক্সেস টোকেনের জন্য কোডটি বিনিময় করুন।
3. ডিভাইস নিয়ন্ত্রণ - অ্যাক্সেস টোকেন সহ কমান্ড পাঠিয়ে ডিভাইসগুলি নিয়ন্ত্রণ করার জন্য স্মার্ট ডিভাইস ম্যানেজমেন্ট API অনুরোধ করুন।

এই কোডল্যাবে আমরা একটি ওয়েব অ্যাপ্লিকেশন তৈরি করে প্রমাণীকরণ পরিচালনা করে এবং স্মার্ট ডিভাইস ম্যানেজমেন্ট API কল করে ডিভাইস অ্যাক্সেস কীভাবে কাজ করে তা গভীরভাবে পর্যালোচনা করব। আমরা ডিভাইস অ্যাক্সেস অনুরোধগুলি রুট করার জন্য Node.js এবং Express ব্যবহার করে একটি সাধারণ প্রক্সি সার্ভার স্থাপন করার পদ্ধতিও অন্বেষণ করব।

শুরু করার আগে, এই কোডল্যাবে আমরা যে সাধারণ ওয়েব প্রযুক্তিগুলি ব্যবহার করব সেগুলি সম্পর্কে জেনে নেওয়া ভালো হবে, যেমন OAuth 2.0 দিয়ে প্রমাণীকরণ করা বা Node.js দিয়ে একটি ওয়েব অ্যাপ তৈরি করা , যদিও এগুলি পূর্বশর্ত নয়।

তোমার যা দরকার

• Node.js ৮ বা তার বেশি
• লিঙ্ক করা Nest Thermostat সহ Google অ্যাকাউন্ট

তুমি যা শিখবে

• স্ট্যাটিক ওয়েব পৃষ্ঠা এবং ক্লাউড ফাংশন হোস্ট করার জন্য একটি ফায়ারবেস প্রকল্প সেট আপ করা
• ব্রাউজার ভিত্তিক ওয়েব অ্যাপ্লিকেশনের মাধ্যমে ডিভাইস অ্যাক্সেসের অনুরোধ জারি করা
• আপনার অনুরোধগুলি রুট করার জন্য Node.js এবং Express দিয়ে একটি প্রক্সি সার্ভার তৈরি করা

2. প্রকল্প তৈরি

ডিভাইস অ্যাক্সেস ইন্টিগ্রেশন সেট আপ করার জন্য ডেভেলপারদের একটি Google ক্লাউড প্ল্যাটফর্ম (GCP) প্রকল্প তৈরি করতে হবে। GCP প্রকল্পের মধ্যে তৈরি একটি ক্লায়েন্ট আইডি এবং ক্লায়েন্ট সিক্রেট ডেভেলপারের অ্যাপ্লিকেশন এবং Google ক্লাউডের মধ্যে OAuth প্রবাহের অংশ হিসাবে ব্যবহার করা হবে। স্মার্ট ডিভাইস ম্যানেজমেন্ট API অ্যাক্সেস করার জন্য একটি প্রকল্প তৈরি করতে ডেভেলপারদের ডিভাইস অ্যাক্সেস কনসোলও দেখতে হবে।

গুগল ক্লাউড প্ল্যাটফর্ম

গুগল ক্লাউড প্ল্যাটফর্মে যান। একটি নতুন প্রকল্প তৈরি করুন ক্লিক করুন এবং একটি প্রকল্পের নাম দিন। গুগল ক্লাউডের জন্য একটি প্রকল্প আইডি [GCP-Project-Id] ও প্রদর্শিত হবে, দয়া করে এটি রেকর্ড করুন কারণ আমরা এটি Firebase সেটআপের সময় ব্যবহার করব। (আমরা এই কোডল্যাব জুড়ে এই আইডিটিকে [GCP-Project-Id] হিসাবে উল্লেখ করব।)

প্রথম ধাপ হল আমাদের প্রকল্পে প্রয়োজনীয় API লাইব্রেরি সক্ষম করা। APIs & Services > Library- এ যান এবং Smart Device Management API অনুসন্ধান করুন। ডিভাইস অ্যাক্সেস API কলগুলিতে অনুরোধ করার জন্য আপনার প্রকল্পটিকে অনুমোদন করার জন্য আপনাকে এই API সক্ষম করতে হবে।

OAuth শংসাপত্র তৈরি করার আগে, আমাদের প্রকল্পের জন্য OAuth সম্মতি স্ক্রিনটি কনফিগার করতে হবে। APIs & Services > OAuth সম্মতি স্ক্রিনে যান। ব্যবহারকারীর ধরণের জন্য, external নির্বাচন করুন। আপনার অ্যাপের জন্য একটি নাম এবং একটি সহায়তা ইমেল প্রদান করুন, সেইসাথে প্রথম স্ক্রিনটি সম্পূর্ণ করার জন্য ডেভেলপারের যোগাযোগের তথ্য প্রদান করুন। যখন Test Users এর জন্য জিজ্ঞাসা করা হয়, তখন এই ধাপে লিঙ্কযুক্ত ডিভাইসগুলির সাথে ইমেল ঠিকানা প্রদান করতে ভুলবেন না।

আপনার OAuth সম্মতি স্ক্রিনটি কনফিগার করার পরে, APIs & Services > Credentials এ যান। +Create Credentials এ ক্লিক করুন এবং OAuth client ID নির্বাচন করুন। অ্যাপ্লিকেশনের ধরণের জন্য, Web application নির্বাচন করুন।

আপনার ক্লায়েন্টের জন্য একটি নাম দিন এবং CREATE এ ক্লিক করুন। আমরা পরে একটি Authorized JavaScript origin এবং Authorized redirect URI যোগ করব। এই প্রক্রিয়াটি সম্পূর্ণ করলে এই OAuth 2.0 ক্লায়েন্টের সাথে সম্পর্কিত [Client-Id] এবং [Client-Secret] প্রদর্শিত হবে।

ডিভাইস অ্যাক্সেস কনসোল

ডিভাইস অ্যাক্সেস কনসোলে যান। যদি আপনি আগে ডিভাইস অ্যাক্সেস কনসোল ব্যবহার না করে থাকেন, তাহলে আপনাকে পরিষেবার শর্তাবলী চুক্তি এবং $5 রেজিস্ট্রেশন ফি প্রদান করা হবে।

একটি নতুন প্রকল্প তৈরি করুন এবং এটিকে একটি প্রকল্পের নাম দিন। পরবর্তী উইন্ডোতে, পূর্ববর্তী ধাপে GCP থেকে প্রাপ্ত [ক্লায়েন্ট-আইডি] প্রদান করুন।

ইভেন্টগুলি সক্ষম করা এবং প্রকল্প তৈরির ধাপগুলি সম্পন্ন করা আপনাকে আপনার প্রকল্পের হোমপেজে নিয়ে যাবে। আপনার [প্রকল্প-আইডি] আপনার প্রকল্পের দেওয়া নামের অধীনে তালিকাভুক্ত হবে।

আপনার [প্রজেক্ট-আইডি] নোট করুন কারণ আমরা স্মার্ট ডিভাইস ম্যানেজমেন্ট API-তে অনুরোধ পাঠানোর সময় এটি ব্যবহার করব।

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

৩. ফায়ারবেস সেটআপ

ফায়ারবেস ডেভেলপারদের ওয়েব অ্যাপ্লিকেশন স্থাপনের একটি দ্রুত এবং সহজ উপায় দেয়। আমরা ফায়ারবেস ব্যবহার করে আমাদের ডিভাইস অ্যাক্সেস ইন্টিগ্রেশনের জন্য একটি ক্লায়েন্ট সাইড ওয়েব অ্যাপ্লিকেশন তৈরি করব।

একটি ফায়ারবেস প্রকল্প তৈরি করুন

Firebase Console এ যান। Add Project এ ক্লিক করুন, তারপর Project Creation ধাপে আপনার তৈরি করা প্রকল্পটি নির্বাচন করুন। এটি একটি Firebase প্রকল্প তৈরি করবে, যা আপনার GCP প্রকল্পের সাথে লিঙ্ক করা হবে [GCP-Project-Id] ।

একবার ফায়ারবেস প্রকল্পটি সফলভাবে তৈরি হয়ে গেলে, আপনি নিম্নলিখিত স্ক্রিনটি দেখতে পাবেন:

ফায়ারবেস টুল ইনস্টল করুন

আপনার অ্যাপ তৈরি এবং স্থাপনের জন্য Firebase এক সেট CLI টুল সরবরাহ করে। এই টুলগুলি ইনস্টল করতে, একটি নতুন টার্মিনাল উইন্ডো খুলুন এবং নিম্নলিখিত কমান্ডটি চালান। এটি বিশ্বব্যাপী Firebase টুলগুলি ইনস্টল করবে।

$ npm i -g firebase-tools

ফায়ারবেস টুলগুলি সঠিকভাবে ইনস্টল করা আছে কিনা তা যাচাই করতে, সংস্করণের তথ্য পরীক্ষা করুন।

$ firebase --version

লগইন কমান্ডের সাহায্যে আপনি আপনার গুগল অ্যাকাউন্ট দিয়ে ফায়ারবেস সিএলআই টুলগুলিতে লগ-ইন করতে পারেন।

$ firebase login

হোস্টিং প্রকল্প শুরু করুন

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

$ firebase init hosting

হোস্টিং প্রকল্প শুরু করার জন্য ফায়ারবেস আপনাকে কিছু প্রশ্ন জিজ্ঞাসা করবে:

1. অনুগ্রহ করে একটি বিকল্প নির্বাচন করুন — একটি বিদ্যমান প্রকল্প ব্যবহার করুন
2. এই ডিরেক্টরির জন্য একটি ডিফল্ট Firebase প্রকল্প নির্বাচন করুন — নির্বাচন করুন***[GCP-Project-Id]***
3. তুমি তোমার পাবলিক ডিরেক্টরি হিসেবে কী ব্যবহার করতে চাও? — পাবলিক
4. একটি একক পৃষ্ঠার অ্যাপ হিসেবে কনফিগার করবেন? — হ্যাঁ
5. GitHub দিয়ে স্বয়ংক্রিয় বিল্ড এবং ডিপ্লয় সেট আপ করবেন? — না

আপনার প্রকল্পটি শুরু হয়ে গেলে, আপনি নিম্নলিখিত কমান্ডের সাহায্যে এটি ফায়ারবেসে স্থাপন করতে পারেন:

$ firebase deploy

ফায়ারবেস আপনার প্রকল্পটি স্ক্যান করবে এবং প্রয়োজনীয় ফাইলগুলি ক্লাউড হোস্টিংয়ে স্থাপন করবে।

যখন আপনি ব্রাউজারে হোস্টিং URL খুলবেন, তখন আপনি যে পৃষ্ঠাটি স্থাপন করেছেন তা দেখতে পাবেন:

এখন যেহেতু আপনি Firebase দিয়ে একটি ওয়েব পৃষ্ঠা কীভাবে স্থাপন করবেন তার মূল বিষয়গুলি জানেন, আসুন আমাদের কোডল্যাব নমুনা স্থাপন করা শুরু করি!

৪. কোডল্যাব নমুনা

আপনি নীচের কমান্ডটি ব্যবহার করে GitHub-এ হোস্ট করা কোডল্যাব রিপোজিটরি ক্লোন করতে পারেন:

$ git clone https://github.com/google/device-access-codelab-web-app.git

এই সংগ্রহস্থলে আমরা দুটি পৃথক ফোল্ডারে নমুনা প্রদান করছি। codelab-start ফোল্ডারে এই কোডল্যাবের বর্তমান বিন্দু থেকে শুরু করার জন্য প্রয়োজনীয় ফাইল রয়েছে। codelab-done ফোল্ডারে এই কোডল্যাবের একটি সম্পূর্ণ সংস্করণ রয়েছে, সম্পূর্ণরূপে কার্যকরী ক্লায়েন্ট এবং node.js সার্ভার সহ।

আমরা এই কোডল্যাব জুড়ে codelab-start ফোল্ডারের ফাইলগুলি ব্যবহার করব, তবে যদি আপনি যেকোনো সময় আটকে থাকেন তবে codelab-done সংস্করণটিও উল্লেখ করতে দ্বিধা করবেন না।

কোডল্যাব নমুনা ফাইল

কোডল্যাব-স্টার্ট ফোল্ডারের ফাইল স্ট্রাকচার নিম্নরূপ:

public
├───index.html
├───scripts.js
├───style.css
firebase.json

পাবলিক ফোল্ডারে আমাদের অ্যাপ্লিকেশনের স্ট্যাটিক পৃষ্ঠা রয়েছে। firebase.json আমাদের অ্যাপে ওয়েব অনুরোধগুলি রাউট করার জন্য দায়ী। codelab-done সংস্করণে, আপনি একটি functions ডিরেক্টরিও দেখতে পাবেন, যেখানে আমাদের প্রক্সি সার্ভার (এক্সপ্রেস) কে Google ক্লাউড ফাংশনে স্থাপন করার জন্য লজিক থাকবে।

কোডল্যাব নমুনা স্থাপন করুন

codelab-start থেকে ফাইলগুলি আপনার প্রকল্পের ডিরেক্টরিতে কপি করুন।

$ firebase deploy

একবার Firebase স্থাপন শেষ করলে, আপনি কোডল্যাব অ্যাপ্লিকেশনটি দেখতে সক্ষম হবেন:

প্রমাণীকরণ প্রবাহ শুরু করার জন্য অংশীদার শংসাপত্রের প্রয়োজন, যা আমরা পরবর্তী বিভাগে আলোচনা করব।

৫. OAuth পরিচালনা করা

OAuth হল অ্যাক্সেস ডেলিগেশনের জন্য ওয়েব স্ট্যান্ডার্ড, যা সাধারণত ব্যবহারকারীদের পাসওয়ার্ড শেয়ার না করেই তৃতীয় পক্ষের অ্যাপ্লিকেশনগুলিকে তাদের অ্যাকাউন্টের তথ্যে অ্যাক্সেস দেওয়ার জন্য ব্যবহৃত হয়। আমরা OAuth 2.0 ব্যবহার করি যাতে ডেভেলপাররা ডিভাইস অ্যাক্সেসের মাধ্যমে ব্যবহারকারীর ডিভাইস অ্যাক্সেস করতে পারে।

পুনঃনির্দেশ URI নির্দিষ্ট করুন

OAuth প্রবাহের প্রথম ধাপ হল Google OAuth 2.0 এন্ডপয়েন্টে কিছু প্যারামিটার পাস করা। ব্যবহারকারীর সম্মতি পাওয়ার পর, Google OAuth সার্ভারগুলি আপনার রিডাইরেক্ট URI-তে একটি অনুমোদন কোড সহ একটি অনুরোধ জারি করবে।

scripts.js এ আপনার নিজস্ব হোস্টিং URL দিয়ে SERVER_URI ধ্রুবক (লাইন 19) আপডেট করুন:

const SERVER_URI = "https://[GCP-Project-Id].web.app";

এই পরিবর্তনের মাধ্যমে অ্যাপটি পুনরায় স্থাপন করলে আপনার প্রকল্পের জন্য ব্যবহৃত রিডাইরেক্ট ইউআরআই আপডেট হবে।

$ firebase deploy

পুনঃনির্দেশ URI সক্ষম করুন

স্ক্রিপ্ট ফাইলে রিডাইরেক্ট ইউআরআই আপডেট করার পরে, আপনার প্রকল্পের জন্য তৈরি করা ক্লায়েন্ট আইডির জন্য অনুমোদিত রিডাইরেক্ট ইউআরআইগুলির তালিকায় এটি যুক্ত করতে হবে। গুগল ক্লাউড প্ল্যাটফর্মের ক্রেডেনশিয়াল পৃষ্ঠায় নেভিগেট করুন, যেখানে আপনার প্রকল্পের জন্য তৈরি সমস্ত ক্রেডেনশিয়াল তালিকাভুক্ত থাকবে:

OAuth 2.0 ক্লায়েন্ট আইডি তালিকার অধীনে, Project Creation ধাপে আপনার তৈরি করা ক্লায়েন্ট আইডি নির্বাচন করুন। আপনার অ্যাপের রিডাইরেক্ট URI আপনার প্রোজেক্টের জন্য অনুমোদিত রিডাইরেক্ট URI তালিকার সাথে যুক্ত করুন।

সাইন ইন করার চেষ্টা করুন!

Firebase দিয়ে সেট আপ করা হোস্টিং URL-এ যান, আপনার পার্টনার ক্রেডেনশিয়াল লিখুন এবং SIGN IN বোতামে ক্লিক করুন। Client Id এবং Client Secret হল Google Cloud Platform থেকে প্রাপ্ত ক্রেডেনশিয়াল, Project Id হল Device Access Console থেকে।

যদি আপনি একটি Error 400: redirect_uri_mismatch , আপনার পুনর্নির্দেশ URI দুবার পরীক্ষা করে দেখুন। নিশ্চিত করুন যে এটি আপনার অনুমোদিত URI গুলির সাথে হুবহু মিলে যায়, যার মধ্যে প্রোটোকল (https://) এবং যেকোনো ট্রেইলিং স্ল্যাশ অন্তর্ভুক্ত।

যদি আপনার কাছে একটি Error 403: access_denied, The developer hasn't given you access to this app - নিশ্চিত করুন যে আপনি আপনার OAuth সম্মতি স্ক্রিন সেটআপের অংশ হিসেবে পরীক্ষামূলক ব্যবহারকারী হিসেবে অ্যাকাউন্ট লিঙ্কিংয়ের সাথে যে ইমেল অ্যাকাউন্টটি ব্যবহার করেন তা যোগ করেছেন।

যদি আপনাকে Google Home অ্যাপ সেটিংসে হোম সদস্য হিসেবে ডেভেলপার ইমেল ঠিকানা যোগ করতে বলা হয়, তাহলে অনুগ্রহ করে তা করুন কারণ ডিভাইস অ্যাক্সেস কনসোলে নতুন তৈরি প্রকল্পগুলি স্যান্ডবক্স সীমাবদ্ধতার আওতায়।

অ্যাকাউন্ট লিঙ্ক করার সময় যদি আপনাকে আপনার Nest অ্যাকাউন্ট Google-এ মাইগ্রেট করতে বলা হয়, তাহলে মাইগ্রেট করার ধাপগুলি অনুসরণ করুন এবং আবার সাইন ইন করার চেষ্টা করুন।

সাইন ইন বোতামটি আপনার ব্যবহারকারীদের আপনার এন্টারপ্রাইজের জন্য OAuth প্রবাহের মধ্য দিয়ে নিয়ে যাবে, লগইন স্ক্রিন থেকে শুরু করে তাদের Google অ্যাকাউন্টে। লগ ইন করার পরে, ব্যবহারকারীদের তাদের Nest ডিভাইসগুলি অ্যাক্সেস করার জন্য আপনার প্রকল্পের অনুমতি দিতে বলা হবে।

যেহেতু এটি একটি নকল অ্যাপ, তাই পুনঃনির্দেশনা জারি করার আগে গুগল একটি সতর্কতা জারি করবে!

"অ্যাডভান্সড" এ ক্লিক করুন, তারপর আপনার অ্যাপে পুনঃনির্দেশনা সম্পূর্ণ করতে "web.app (unsafe) এ যান" নির্বাচন করুন।

এটি আগত GET অনুরোধের অংশ হিসেবে একটি OAuth কোড প্রদান করবে, যা অ্যাপটি তখন একটি অ্যাক্সেস টোকেন এবং একটি রিফ্রেশ টোকেনের সাথে বিনিময় করবে।

6. ডিভাইস নিয়ন্ত্রণ

ডিভাইস অ্যাক্সেস নমুনা অ্যাপটি গুগল নেস্ট ডিভাইসগুলি নিয়ন্ত্রণ করতে স্মার্ট ডিভাইস ম্যানেজমেন্ট REST API কল ব্যবহার করে। এই কলগুলিতে নির্দিষ্ট কমান্ডের জন্য প্রয়োজনীয় একটি পেলোডের পাশাপাশি একটি GET বা POST অনুরোধের শিরোনামে অ্যাক্সেস টোকেন পাস করা জড়িত।

এই কলগুলি পরিচালনা করার জন্য আমরা একটি জেনেরিক অ্যাক্সেস রিকোয়েস্ট ফাংশন লিখেছি। তবে, আপনাকে এই ফাংশনে সঠিক এন্ডপয়েন্ট, এবং প্রয়োজনে পেলোড অবজেক্ট প্রদান করতে হবে!

function deviceAccessRequest(method, call, localpath, payload = null) {...}

• পদ্ধতি — HTTP অনুরোধের ধরণ ( GET অথবা POST)
• call — আমাদের API কলের প্রতিনিধিত্বকারী একটি স্ট্রিং, যা প্রতিক্রিয়া রুট করতে ব্যবহৃত হয় ( listDevices , thermostatMode , temperatureSetpoint )
• লোকালপাথ — যে শেষ বিন্দুতে অনুরোধ করা হয়েছে, তাতে প্রজেক্ট আইডি এবং ডিভাইস আইডি থাকবে ( https://smartdevicemanagement.googleapis.com/v1 এর পরে যুক্ত করা হবে)
• পেলোড (*) — API কলের জন্য প্রয়োজনীয় অতিরিক্ত ডেটা (উদাহরণস্বরূপ, একটি সেটপয়েন্টের তাপমাত্রা প্রতিনিধিত্বকারী একটি সংখ্যাসূচক মান)

আমরা একটি নেস্ট থার্মোস্ট্যাট নিয়ন্ত্রণ করার জন্য নমুনা UI নিয়ন্ত্রণ (তালিকা ডিভাইস, সেট মোড, সেট টেম্প) তৈরি করব:

এই UI কন্ট্রোলগুলি scripts.js থেকে সংশ্লিষ্ট ফাংশনগুলি ( listDevices() , postThermostatMode() , postTemperatureSetpoint() ) কল করবে। আপনার বাস্তবায়নের জন্য এগুলি ফাঁকা রাখা হয়েছে! লক্ষ্য হল সঠিক পদ্ধতি/পথ বেছে নেওয়া এবং পেলোডটি deviceAccessRequest(...) ফাংশনে প্রেরণ করা।

ডিভাইসগুলির তালিকা করুন

সবচেয়ে সহজ ডিভাইস অ্যাক্সেস কল হল listDevices । এটি একটি GET অনুরোধ ব্যবহার করে এবং কোনও পেলোডের প্রয়োজন হয় না। এন্ডপয়েন্টটি projectId ব্যবহার করে গঠন করা প্রয়োজন। আপনার listDevices() ফাংশনটি নিম্নলিখিতভাবে সম্পূর্ণ করুন:

function listDevices() {
  var endpoint = "/enterprises/" + projectId + "/devices";
  deviceAccessRequest('GET', 'listDevices', endpoint);
}

আপনার পরিবর্তনগুলি সংরক্ষণ করুন এবং নিম্নলিখিত কমান্ডটি ব্যবহার করে আপনার Firebase প্রকল্পটি আবার স্থাপন করুন:

$ firebase deploy

অ্যাপটির নতুন সংস্করণটি চালু হয়ে গেলে, পৃষ্ঠাটি পুনরায় লোড করার চেষ্টা করুন এবং LIST DEVICES এ ক্লিক করুন। এটি ডিভাইস নিয়ন্ত্রণের অধীনে তালিকাটি পূরণ করবে, যেখানে আপনি আপনার থার্মোস্ট্যাটের আইডি দেখতে পাবেন:

তালিকা থেকে ডিভাইসগুলি নির্বাচন করলে scripts.js ফাইলের deviceId ফিল্ডটি আপডেট হবে। পরবর্তী দুটি নিয়ন্ত্রণের জন্য, আমরা যে নির্দিষ্ট ডিভাইসটি নিয়ন্ত্রণ করতে চাই তার জন্য deviceId নির্দিষ্ট করতে হবে।

থার্মোস্ট্যাট নিয়ন্ত্রণ

স্মার্ট ডিভাইস ম্যানেজমেন্ট API-তে নেস্ট থার্মোস্ট্যাটের মৌলিক নিয়ন্ত্রণের জন্য দুটি বৈশিষ্ট্য রয়েছে: থার্মোস্ট্যাটমোড এবং টেম্পারেচারসেটপয়েন্ট । থার্মোস্ট্যাটমোড আপনার নেস্ট থার্মোস্ট্যাটের জন্য মোডটি সম্ভাব্য চারটি ভিন্ন মোডের একটিতে সেট করে: {অফ, হিট, কুল, হিটকুল}। এরপর আমাদের পেলোডের অংশ হিসেবে নির্বাচিত মোডটি প্রদান করতে হবে।

scripts.js এ আপনার postThermostatMode() ফাংশনটি নিম্নলিখিতটি দিয়ে প্রতিস্থাপন করুন:

function postThermostatMode() {
  var endpoint = "/enterprises/" + projectId + "/devices/" + deviceId + ":executeCommand";
  var tempMode = id("tempMode").value;
  var payload = {
    "command": "sdm.devices.commands.ThermostatMode.SetMode",
    "params": {
      "mode": tempMode
    }
  };
  deviceAccessRequest('POST', 'thermostatMode', endpoint, payload);
}

পরবর্তী ফাংশন, postTemperatureSetpoint() , আপনার Nest Thermostat এর জন্য তাপমাত্রা (সেলসিয়াসে) সেট করার কাজ পরিচালনা করে। নির্বাচিত থার্মোস্ট্যাট মোডের উপর নির্ভর করে পেলোডে দুটি প্যারামিটার সেট করা যেতে পারে, heatCelsius এবং coolCelsius ।

function postTemperatureSetpoint() {
  var endpoint = "/enterprises/" + projectId + "/devices/" + deviceId + ":executeCommand";
  var heatCelsius = parseFloat(id("heatCelsius").value);
  var coolCelsius = parseFloat(id("coolCelsius").value);

  var payload = {
    "command": "",
    "params": {}
  };
  
  if ("HEAT" === id("tempMode").value) {
    payload.command = "sdm.devices.commands.ThermostatTemperatureSetpoint.SetHeat";
    payload.params["heatCelsius"] = heatCelsius;
  }
  else if ("COOL" === id("tempMode").value) {
    payload.command = "sdm.devices.commands.ThermostatTemperatureSetpoint.SetCool";
    payload.params["coolCelsius"] = coolCelsius;
  }
  else if ("HEATCOOL" === id("tempMode").value) {
    payload.command = "sdm.devices.commands.ThermostatTemperatureSetpoint.SetRange";
    payload.params["heatCelsius"] = heatCelsius;
    payload.params["coolCelsius"] = coolCelsius;
  } else {
    console.log("Off and Eco mode don't allow this function");
    return;
  }
  deviceAccessRequest('POST', 'temperatureSetpoint', endpoint, payload);
}

গুরুত্বপূর্ণ: প্রথমে আপনার থার্মোস্ট্যাটের মোড সেট করতে ভুলবেন না, এবং সেই অনুযায়ী একটি TemperatureSetpoint পরিবর্তন ইস্যু করুন! heatCelsius এবং coolCelsius শুধুমাত্র সংশ্লিষ্ট মোডে পাঠানো যেতে পারে, এবং একটি অসমর্থিত মোডে তাপমাত্রা সেট করার ফলে HTTP 500 ত্রুটি দেখা দেয়!

৭. Node.js সার্ভার (ঐচ্ছিক)

অভিনন্দন! আপনি একটি ক্লায়েন্ট সাইড ওয়েব অ্যাপ্লিকেশন তৈরি করেছেন যা ব্রাউজার থেকে স্মার্ট ডিভাইস ম্যানেজমেন্ট API অনুরোধ করতে পারে। আপনারা যারা সার্ভার সাইডে তৈরি করতে চান, আমরা একটি প্রক্সি সার্ভার দিয়ে আপনার প্রচেষ্টা শুরু করতে চাই যা ব্রাউজার থেকে আপনার অনুরোধগুলি পুনঃনির্দেশিত করতে পারে।

এই প্রক্সি সার্ভারের জন্য, আমরা Firebase ক্লাউড ফাংশন, Node.js এবং Express ব্যবহার করব।

ক্লাউড ফাংশন শুরু করুন

একটি নতুন টার্মিনাল উইন্ডো খুলুন, আপনার প্রকল্প ডিরেক্টরিতে নেভিগেট করুন এবং নিম্নলিখিতটি চালান:

$ firebase init functions

ক্লাউড ফাংশন শুরু করার জন্য ফায়ারবেস আপনাকে কিছু প্রশ্ন জিজ্ঞাসা করবে:

1. ক্লাউড ফাংশন লেখার জন্য আপনি কোন ভাষা ব্যবহার করতে চান? — জাভাস্ক্রিপ্ট
2. আপনি কি সম্ভাব্য বাগ ধরার জন্য এবং স্টাইল প্রয়োগের জন্য ESLint ব্যবহার করতে চান? — না
3. আপনি কি এখন npm দিয়ে নির্ভরতা ইনস্টল করতে চান? — হ্যাঁ

এটি আপনার প্রোজেক্টে একটি functions ফোল্ডার চালু করবে, এবং প্রয়োজনীয় নির্ভরতা ইনস্টল করবে। আপনি দেখতে পাবেন যে আপনার প্রোজেক্ট ফোল্ডারে একটি ফাংশন ডিরেক্টরি রয়েছে, যেখানে আমাদের ক্লাউড ফাংশন সংজ্ঞায়িত করার জন্য একটি index.js ফাইল, সেটিংস সংজ্ঞায়িত করার জন্য package.json এবং নির্ভরতা ধারণ করার জন্য একটি node_modules ডিরেক্টরি রয়েছে।

সার্ভার-সাইড কার্যকারিতা তৈরি করতে আমরা দুটি npm লাইব্রেরি ব্যবহার করব: express এবং xmlhttprequest। package.json ফাইলের নির্ভরতার তালিকায় আপনাকে নিম্নলিখিত এন্ট্রিগুলি যোগ করতে হবে:

"xmlhttprequest": "^1.8.0",
"express": "^4.17.0"

তারপর functions ডিরেক্টরি থেকে npm install চালানোর মাধ্যমে আপনার প্রকল্পের জন্য নির্ভরতা ইনস্টল করা উচিত:

$ npm install

যদি npm প্যাকেজ ডাউনলোড করতে কোনও সমস্যা অনুভব করে, তাহলে আপনি xmlhttprequest সংরক্ষণ করার চেষ্টা করতে পারেন এবং নিম্নলিখিত কমান্ড ব্যবহার করে স্পষ্টভাবে প্রকাশ করতে পারেন:

$ npm install express xmlhttprequest --save

ব্লেজ প্ল্যানে আপগ্রেড করুন

firebase deploy কমান্ড ব্যবহার করার জন্য আপনাকে Blaze প্ল্যানে আপগ্রেড করতে হবে, যার জন্য আপনাকে আপনার অ্যাকাউন্টে একটি পেমেন্ট পদ্ধতি যোগ করতে হবে। Project Overview > Usage and Billing এ যান এবং আপনার Project এর জন্য Blaze প্ল্যান নির্বাচন করতে ভুলবেন না।

এক্সপ্রেস সার্ভার তৈরি করুন

একটি এক্সপ্রেস সার্ভার ইনকামিং GET এবং POST অনুরোধের প্রতিক্রিয়া জানাতে একটি সহজ কাঠামো অনুসরণ করে। আমরা একটি সার্ভলেট তৈরি করেছি যা POST অনুরোধগুলি শোনে, পেলোডে নির্দিষ্ট একটি গন্তব্য URL এ প্রেরণ করে এবং স্থানান্তর থেকে প্রাপ্ত প্রতিক্রিয়ার সাথে প্রতিক্রিয়া জানায়।

ফাংশন ডিরেক্টরিতে আপনার index.js ফাইলটি এইরকম দেখতে পরিবর্তন করুন:

const XMLHttpRequest = require("xmlhttprequest").XMLHttpRequest;
const functions = require('firebase-functions');
const express = require('express');
const http = require('http');

const app = express();
app.use(express.json());


//***** Device Access - Proxy Server *****//

// Serving Get Requests (Not used) 
app.get('*', (request, response) => {
  response.status(200).send("Hello World!");
});
// Serving Post Requests
app.post('*', (request, response) => {
  
  setTimeout(() => {
    // Read the destination address from payload:
    var destination = request.body.address;
    
    // Create a new proxy post request:
    var xhr = new XMLHttpRequest();
    xhr.open('POST', destination);
    
    // Add original headers to proxy request:
    for (var key in request.headers) {
            var value = request.headers[key];
      xhr.setRequestHeader(key, value);
    }
    
    // Add command/parameters to proxy request:
    var newBody = {};
    newBody.command = request.body.command;
    newBody.params = request.body.params;
    
    // Respond to original request with the response coming
    // back from proxy request (to Device Access Endpoint)
    xhr.onload = function () {
      response.status(200).send(xhr.responseText);
    };
    
    // Send the proxy request!
    xhr.send(JSON.stringify(newBody));
  }, 1000);
});

// Export our app to firebase functions:
exports.app = functions.https.onRequest(app);

আমাদের সার্ভারে অনুরোধগুলি রুট করার জন্য, আমাদের firebase.json থেকে পুনর্লিখনগুলি নিম্নলিখিতভাবে সামঞ্জস্য করতে হবে:

{
  "hosting": {
    "public": "public",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "rewrites": [{
        "source": "/proxy**",
        "function": "app"
      },{
        "source": "**",
        "destination": "/index.html"
      }
    ]
  }
}

এটি /proxy দিয়ে শুরু হওয়া URL গুলিকে আমাদের এক্সপ্রেস সার্ভারে রাউট করবে এবং বাকিগুলি আমাদের index.html এ যেতে থাকবে।

প্রক্সি এপিআই কল

এখন যেহেতু আমাদের সার্ভার প্রস্তুত, আসুন scripts.js এ একটি প্রক্সি URI সংজ্ঞায়িত করি যাতে আমাদের ব্রাউজার এই ঠিকানায় অনুরোধ পাঠাতে পারে:

const PROXY_URI = SERVER_URI + "/proxy";

তারপর পরোক্ষ ডিভাইস অ্যাক্সেস কলের জন্য একটি proxyRequest ফাংশন যোগ করুন যা হল scripts.js , যার স্বাক্ষর deviceAccessRequest(...) ফাংশনের মতোই।

function proxyRequest(method, call, localpath, payload = null) {
    var xhr = new XMLHttpRequest();
    
    // We are doing our post request to our proxy server:
    xhr.open(method, PROXY_URI);
    xhr.setRequestHeader('Authorization', 'Bearer ' + accessToken);
    xhr.setRequestHeader('Content-Type', 'application/json;charset=UTF-8');
    xhr.onload = function () {
      // Response is passed to deviceAccessResponse function:
      deviceAccessResponse(call, xhr.response);
    };
    
    // We are passing the device access endpoint in address field of the payload:
    payload.address = "https://smartdevicemanagement.googleapis.com/v1" + localpath;
    if ('POST' === method && payload)
        xhr.send(JSON.stringify(payload));
    else
        xhr.send();
}

শেষ ধাপ হল deviceAccessRequest(...) কলগুলিকে postThermostatMode() এবং scripts.js মধ্যে postTemperatureSetpoint() ফাংশনে proxyRequest(...) ফাংশন দিয়ে প্রতিস্থাপন করা।

অ্যাপটি আপডেট করতে firebase deploy চালান।

$ firebase deploy

এর মাধ্যমে, আপনার কাছে এখন একটি চলমান Node.js প্রক্সি সার্ভার আছে যা Express on Cloud Functions ব্যবহার করে।

ক্লাউড ফাংশনের অনুমতি প্রদান করুন

শেষ ধাপ হল আপনার ক্লাউড ফাংশনগুলির জন্য অ্যাক্সেস অনুমতিগুলি পর্যালোচনা করা এবং নিশ্চিত করা যে আপনার ক্লায়েন্ট সাইড অ্যাপ্লিকেশন তাদের কল করতে সক্ষম হবে।

গুগল ক্লাউড প্ল্যাটফর্ম থেকে, মেনু থেকে ক্লাউড ফাংশন ট্যাবে যান, তারপর আপনার ক্লাউড ফাংশনটি নির্বাচন করুন:

Permissions এ ক্লিক করুন, তারপর Add Member এ ক্লিক করুন। নতুন সদস্য ক্ষেত্রে allUsers লিখুন, এবং Cloud Functions > Cloud Functions Invoker কে ভূমিকা হিসেবে নির্বাচন করুন। Save এ ক্লিক করলে একটি সতর্কতা বার্তা প্রদর্শিত হবে:

"পাবলিক অ্যাক্সেসের অনুমতি দিন" নির্বাচন করলে আপনার ক্লায়েন্ট সাইড অ্যাপ্লিকেশনটি আপনার ক্লাউড ফাংশন ব্যবহার করতে সক্ষম হবে।

অভিনন্দন - আপনি সমস্ত ধাপ সম্পন্ন করেছেন। আপনি এখন আপনার ওয়েব অ্যাপে যেতে পারেন এবং আপনার প্রক্সি সার্ভারের মাধ্যমে ডিভাইস নিয়ন্ত্রণগুলি ব্যবহার করে দেখতে পারেন!

পরবর্তী পদক্ষেপ

ডিভাইস অ্যাক্সেসে আপনার দক্ষতা বাড়ানোর উপায় খুঁজছেন? অন্যান্য নেস্ট ডিভাইস নিয়ন্ত্রণ সম্পর্কে আরও জানতে এবং আপনার পণ্যটি বিশ্বের কাছে লঞ্চ করার পদক্ষেপগুলি শেখার জন্য সার্টিফিকেশন প্রক্রিয়া সম্পর্কে আরও জানতে বৈশিষ্ট্য ডকুমেন্টেশনগুলি দেখুন!

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