iframe এবং ক্যোয়ারী পরামিতি বিবরণ

ব্যবহারকারীকে একটি নির্বিঘ্ন ও সুবিধাজনক অভিজ্ঞতা প্রদানের জন্য ক্লাসরুম অ্যাড-অনগুলো একটি আইফ্রেমের মধ্যে লোড করা হয়। পাঁচ ধরনের স্বতন্ত্র আইফ্রেম রয়েছে; প্রতিটি আইফ্রেমের উদ্দেশ্য ও চেহারা সম্পর্কে একটি সার্বিক ধারণা পেতে ইউজার জার্নি ডিরেক্টরির আইফ্রেম পৃষ্ঠাগুলো দেখুন।

আইফ্রেম নিরাপত্তা নির্দেশিকা

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

সার্ভার অ্যাপ্লিকেশন কনফিগারেশন

আইফ্রেমটি সুরক্ষিত রাখতে, আমরা নিম্নলিখিত সার্ভার কনফিগারেশনগুলো সুপারিশ করি:

• HTTPS আবশ্যক । আমরা TLS 1.2 বা তার চেয়ে উন্নত সংস্করণ ব্যবহার করার এবং HTTP Strict Transport Security (HSTS) সক্রিয় করার জন্য দৃঢ়ভাবে সুপারিশ করছি। Strict Transport Security সম্পর্কে এই সম্পর্কিত MDN নিবন্ধটি দেখুন।
• কঠোর বিষয়বস্তু সুরক্ষা নীতি (Strict CSP) সক্রিয় করুন। এই OWASP নিবন্ধ এবং বিষয়বস্তু সুরক্ষা নীতি সম্পর্কিত এই MDN নিবন্ধটি দেখুন।
• Secure কুকি অ্যাট্রিবিউটটি সক্রিয় করুন। HttpOnly অ্যাট্রিবিউট এবং কুকি সম্পর্কিত এই MDN আর্টিকেলটি দেখুন।

কোয়েরি প্যারামিটার

আইফ্রেমগুলো কোয়েরি প্যারামিটার হিসেবে অ্যাড-অনটিতে গুরুত্বপূর্ণ তথ্য প্রেরণ করে। প্যারামিটারগুলো দুই ধরনের হয়: অ্যাটাচমেন্ট-সম্পর্কিত এবং সাইন-ইন-সম্পর্কিত প্যারামিটার।

সংযুক্তি-সম্পর্কিত পরামিতি

সংযুক্তি-সম্পর্কিত প্যারামিটারগুলো অ্যাড-অনটিকে কোর্স, অ্যাসাইনমেন্ট, অ্যাড-অন সংযুক্তি, শিক্ষার্থীর জমা দেওয়া তথ্য এবং একটি অনুমোদনকারী টোকেন সম্পর্কে তথ্য প্রদান করে।

কোর্স আইডি

courseId মানটি হলো কোর্সটির একটি শনাক্তকারী।

সকল আইফ্রেমের সাথে অন্তর্ভুক্ত।

আইটেম আইডি

itemId ভ্যালুটি হলো সেই Announcement , CourseWork , বা CourseWorkMaterial এর একটি শনাক্তকারী, যার সাথে এই অ্যাটাচমেন্টটি সংযুক্ত রয়েছে।

সকল আইফ্রেমের সাথে অন্তর্ভুক্ত।

আইটেমের ধরন

` itemType ভ্যালুটি সেই রিসোর্স টাইপকে শনাক্ত করে যার উপর এই অ্যাটাচমেন্টটি সংযুক্ত। প্রদত্ত স্ট্রিং ভ্যালুটি হলো "announcements" , "courseWork" , অথবা "courseWorkMaterials" এর মধ্যে যেকোনো একটি।

সকল আইফ্রেমের সাথে অন্তর্ভুক্ত।

সংযুক্তি আইডি

attachmentId মানটি হলো অ্যাটাচমেন্টটির একটি শনাক্তকারী।

teacherViewUri , studentViewUri এবং studentWorkReviewUri আইফ্রেমগুলোর সাথে অন্তর্ভুক্ত।

জমা দেওয়ার আইডি

submissionId ভ্যালুটি শিক্ষার্থীর কাজের একটি শনাক্তকারী, কিন্তু কোনো নির্দিষ্ট অ্যাসাইনমেন্টের কাজ শনাক্ত করার জন্য এটি attachmentId সাথে একত্রে ব্যবহার করা উচিত।

studentWorkReviewUri এর সাথে অন্তর্ভুক্ত।

অ্যাড-অন টোকেন

addOnToken ভ্যালুটি একটি অথরাইজেশন টোকেন, যা অ্যাড-অন তৈরি করার জন্য addOnAttachments.create কলগুলো করতে ব্যবহৃত হয়।

অ্যাটাচমেন্ট ডিসকভারি আইফ্রেম এবং লিঙ্ক আপগ্রেড আইফ্রেম-এর সাথে অন্তর্ভুক্ত।

আপগ্রেড করার জন্য URL

urlToUpgrade ভ্যালুটির উপস্থিতি বোঝায় যে শিক্ষক অ্যাসাইনমেন্টে একটি লিঙ্ক অ্যাটাচমেন্ট অন্তর্ভুক্ত করেছেন এবং এটিকে একটি অ্যাড-অন অ্যাটাচমেন্টে আপগ্রেড করতে সম্মত হয়েছেন। যদি আপনার এই ফিচারটি আগে থেকে কনফিগার করা না থাকে, তাহলে আরও বিস্তারিত জানতে লিঙ্ককে অ্যাড-অন অ্যাটাচমেন্টে আপগ্রেড করার নির্দেশিকাটি দেখুন।

লিঙ্ক আপগ্রেড আইফ্রেমের সাথে অন্তর্ভুক্ত।

সাইন-ইন সম্পর্কিত প্যারামিটার

login_hint কোয়েরি প্যারামিটারটি অ্যাড-অন ওয়েব পেজটি পরিদর্শনকারী Classroom ব্যবহারকারী সম্পর্কে তথ্য প্রদান করে। এই কোয়েরি প্যারামিটারটি iframe src URL-এ দেওয়া থাকে। যখন ব্যবহারকারী পূর্বে আপনার অ্যাড-অনটি ব্যবহার করে থাকেন, তখন এটি পাঠানো হয়, যা ব্যবহারকারীর সাইন-ইন সংক্রান্ত জটিলতা কমাতে সাহায্য করে। আপনার অ্যাড-অন বাস্তবায়নে এই কোয়েরি প্যারামিটারটি পরিচালনা করা আবশ্যক।

লগইন ইঙ্গিত

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

login_hint প্যারামিটারটির দুটি সম্ভাব্য ব্যবহার রয়েছে:

1. প্রমাণীকরণ প্রক্রিয়ার সময় login_hint ভ্যালুটি পাস করুন, যাতে সাইন-ইন ডায়ালগটি প্রদর্শিত হলে ব্যবহারকারীকে তার ক্রেডেনশিয়াল প্রবেশ করাতে না হয়। ব্যবহারকারী স্বয়ংক্রিয়ভাবে সাইন-ইন হন না।
2. ব্যবহারকারী সাইন-ইন করার পরে, এই প্যারামিটারটি ব্যবহার করে অ্যাড-অনটিতে আগে থেকেই সাইন-ইন করা ব্যবহারকারীদের সাথে মানটি তুলনা করুন। যদি মিল খুঁজে পান, তাহলে আপনি ব্যবহারকারীকে সাইন-ইন করা অবস্থায় রাখতে পারেন এবং সাইন-ইন প্রক্রিয়া দেখানো এড়িয়ে যেতে পারেন। যদি প্যারামিটারটি আপনার সাইন-ইন করা কোনো ব্যবহারকারীর সাথে না মেলে, তাহলে একটি গুগল ব্র্যান্ডেড সাইন-ইন বোতামের মাধ্যমে ব্যবহারকারীকে সাইন-ইন করতে বলুন।

সকল আইফ্রেমের সাথে অন্তর্ভুক্ত।

সংযুক্তি আবিষ্কার আইফ্রেম

সংযুক্তি আবিষ্কারের উদাহরণ পরিস্থিতি

1. একটি ক্লাসরুম অ্যাড-অন গুগল ওয়ার্কস্পেস মার্কেটপ্লেসে https://example.com/addon অ্যাটাচমেন্ট ডিসকভারি ইউআরআই (Attachment Discovery URI) সহ নিবন্ধিত আছে।
2. একজন শিক্ষক এই অ্যাড-অনটি ইনস্টল করেন এবং তাদের কোনো একটি কোর্সের মধ্যে একটি নতুন ঘোষণা, অ্যাসাইনমেন্ট বা উপকরণ তৈরি করেন। উদাহরণস্বরূপ, itemId=234 , itemType=courseWork এবং courseId=123 ।
3. ওই আইটেমটি কনফিগার করার সময়, শিক্ষক নতুন ইনস্টল করা অ্যাড-অনটিকে একটি সংযুক্তি হিসেবে বেছে নেন।
4. ক্লাসরুম একটি আইফ্রেম তৈরি করে যার src URL হলো https://example.com/addon?courseId=123&itemId=234&itemType=courseWork&addOnToken=456 ।
   1. শিক্ষক একটি সংযুক্তি নির্বাচন করার জন্য আইফ্রেমের মধ্যে কাজ করেন।
5. অ্যাটাচমেন্ট নির্বাচন করা হলে, অ্যাড-অনটি আইফ্রেমটি বন্ধ করার জন্য ক্লাসরুমে একটি postMessage পাঠায়।

teacherViewUri এবং studentViewUri আইফ্রেম

studentWorkReviewUri iframe

লিঙ্ক আপগ্রেড আইফ্রেম

লিঙ্ক আপগ্রেডের উদাহরণ পরিস্থিতি

1. একটি ক্লাসরুম অ্যাড-অন https://example.com/upgrade লিঙ্ক আপগ্রেড ইউআরআই (URI) দিয়ে নিবন্ধিত আছে। আপনি লিঙ্ক অ্যাটাচমেন্টগুলির জন্য নিম্নলিখিত হোস্ট এবং পাথ প্রিফিক্স প্যাটার্নগুলি প্রদান করেছেন, যেগুলিকে ক্লাসরুম একটি অ্যাড-অন অ্যাটাচমেন্টে আপগ্রেড করার চেষ্টা করবে:
   • হোস্ট হলো example.com এবং পাথ প্রিফিক্স হলো /quiz ।
2. একজন শিক্ষক তাঁর কোনো একটি কোর্সের মধ্যে একটি নতুন ঘোষণা, অ্যাসাইনমেন্ট বা উপকরণ তৈরি করেন। উদাহরণস্বরূপ, itemId=234 , itemType=courseWork এবং courseId=123 ।
3. একজন শিক্ষক আপনার দেওয়া URL প্যাটার্নের সাথে মেলে এমন একটি লিঙ্ক, https://example.com/quiz/5678 , লিঙ্ক অ্যাটাচমেন্ট ডায়ালগে পেস্ট করেন। এরপর শিক্ষককে লিঙ্কটিকে একটি অ্যাড-অন অ্যাটাচমেন্টে আপগ্রেড করার জন্য অনুরোধ করা হয়।

4. ক্লাসরুম https://example.com/upgrade?courseId=123&itemId=234&itemType=courseWork&addOnToken=456&urlToUpgrade=https%3A%2F%2Fexample.com%2Fquiz%2F5678 এই URL-টি সেট করে Link Upgrade iframe-টি চালু করে।

5. আপনি আইফ্রেমে পাঠানো কোয়েরি প্যারামিটারগুলো মূল্যায়ন করেন এবং CreateAddOnAttachment এন্ডপয়েন্টে একটি কল করেন। মনে রাখবেন যে, আইফ্রেমে পাঠানোর সময় urlToUpgrade কোয়েরি প্যারামিটারটি URI এনকোড করা থাকে। এটিকে এর আসল রূপে পেতে আপনাকে প্যারামিটারটি ডিকোড করতে হবে। উদাহরণস্বরূপ, জাভাস্ক্রিপ্টে decodeURIComponent() ফাংশনটি রয়েছে।

6. লিঙ্ক থেকে সফলভাবে একটি অ্যাড-অন অ্যাটাচমেন্ট তৈরি হলে, আইফ্রেমটি বন্ধ করার জন্য আপনি ক্লাসরুমে একটি postMessage পাঠান।

আইফ্রেমটি বন্ধ করুন

লার্নিং টুল থেকে {type: 'Classroom', action: 'closeIframe'} পেলোড সহ একটি postMessage পাঠিয়ে আইফ্রেমটি বন্ধ করা যেতে পারে। ক্লাসরুম শুধুমাত্র সেই মূল URI-এর সাথে সম্পর্কিত host_name+port থেকে এই postMessage গ্রহণ করে।

<button id="close">Send message to close iframe</button>
<script>
  document.querySelector('#close')
    .addEventListener('click', () => {
        window.parent.postMessage({
            type: 'Classroom',
            action: 'closeIframe',
        }, '*');
    });
</script>

আইফ্রেম থেকে আইফ্রেমটি বন্ধ করুন

যে পেজ থেকে postMessage ইভেন্টটি পাঠানো হচ্ছে, তার ডোমেইন ও পোর্ট অবশ্যই iframe চালু করতে ব্যবহৃত URI-এর ডোমেইন ও পোর্টের সাথে একই হতে হবে, অন্যথায় বার্তাটি উপেক্ষা করা হয়। এর একটি বিকল্প উপায় হলো মূল ডোমেইনের এমন একটি পেজে রিডাইরেক্ট করা, যা postMessage ইভেন্ট পাঠানো ছাড়া আর কিছুই করে না।

নতুন ট্যাব থেকে আইফ্রেম বন্ধ করুন

ক্রস-ডোমেইন সুরক্ষার কারণে এটি কাজ করে না। এর একটি বিকল্প উপায় হলো, আইফ্রেম এবং নতুন ট্যাবের মধ্যেকার যোগাযোগ নিজে থেকেই পরিচালনা করা এবং ক্লোজ postMessage ইভেন্টটি জারি করার চূড়ান্ত দায়িত্ব আইফ্রেমের উপর ছেড়ে দেওয়া। প্রসঙ্গত উল্লেখ্য, "ওপেন ইন পার্টনার নেম" হাইপারলিঙ্কটি সরিয়ে ফেলা হচ্ছে, যাতে অদূর ভবিষ্যতে ব্যবহারকারীরা এভাবে ট্যাব তৈরি না করেন।

বিধিনিষেধ

সমস্ত আইফ্রেম নিম্নলিখিত স্যান্ডবক্স অ্যাট্রিবিউট সহ খোলা হয়:

• allow-popups
• allow-popups-to-escape-sandbox
• allow-forms
• allow-scripts
• allow-storage-access-by-user-activation
• allow-same-origin

এবং নিম্নলিখিত বৈশিষ্ট্য নীতি:

• allow="microphone *"

তৃতীয় পক্ষের কুকি ব্লক করা

মনে রাখবেন যে, থার্ড-পার্টি কুকি ব্লক করার কারণে একটি আইফ্রেমে সাইন-ইন করা সেশন বজায় রাখা কঠিন হয়ে পড়ে। বিভিন্ন ব্রাউজারে কুকি ব্লক করার বর্তমান অবস্থা সম্পর্কে জানতে https://www.cookiestatus.com দেখুন। অবশ্যই, এই সমস্যাটি শুধু গুগল ক্লাসরুম অ্যাড-অনগুলোর ক্ষেত্রেই সীমাবদ্ধ নয় এবং এটি সেই সমস্ত ওয়েবসাইটকেই প্রভাবিত করে যেগুলো থার্ড-পার্টি কুকি আইফ্রেমে যুক্ত করে। আমাদের অনেক পার্টনার ইতিমধ্যেই এই সমস্যার সম্মুখীন হয়েছেন।

কিছু সাধারণ সমাধান হলো:

• ফার্স্ট-পার্টি কনটেক্সটে কুকি তৈরি করতে একটি নতুন ট্যাব খুলুন। কিছু ব্রাউজার থার্ড-পার্টি কনটেক্সটে থাকা অবস্থায়ও ফার্স্ট-পার্টি কনটেক্সটে তৈরি করা কুকি অ্যাক্সেস করার অনুমতি দেয়।
• ব্যবহারকারীকে থার্ড-পার্টি কুকিজের অনুমতি দিতে বলুন। সব ব্যবহারকারীর ক্ষেত্রে এটি সবসময় সম্ভব নাও হতে পারে।
• এমন এক-পৃষ্ঠার ওয়েব অ্যাপ্লিকেশন ডিজাইন করুন যা কুকির উপর নির্ভর করে না।

ভবিষ্যতের ব্রাউজার সংস্করণগুলিতে কুকির উপর আরও বিধিনিষেধ আরোপ করা হবে বলে আশা করা হচ্ছে। পার্টনারদের কাজের চাপ কীভাবে কমানো যায়, সে বিষয়ে গুগলকে মতামত জানাতে ফিচার রিকোয়েস্ট তৈরি করুন।

ইউআরএল রেগুলার এক্সপ্রেশন ব্যবহার করে অ্যাড-অনগুলির সন্ধানযোগ্যতা সক্ষম করুন।

শিক্ষকরা প্রায়শই লিঙ্ক সংযুক্ত করে অ্যাসাইনমেন্ট তৈরি করেন। আপনার অ্যাড-অনের ব্যবহারকে উৎসাহিত করতে, আপনি এমন রেগুলার এক্সপ্রেশন নির্দিষ্ট করে দিতে পারেন যা আপনার অ্যাড-অনে অ্যাক্সেসযোগ্য রিসোর্সগুলোর URL-এর সাথে মেলে। কোনো শিক্ষক যখন আপনার রেগুলার এক্সপ্রেশনগুলোর একটির সাথে মেলে এমন একটি লিঙ্ক সংযুক্ত করেন, তখন তিনি একটি বাতিলযোগ্য ডায়ালগ দেখতে পান যা তাকে আপনার অ্যাড-অনটি ব্যবহার করে দেখতে উৎসাহিত করে। তিনি কেবল তখনই এই ডায়ালগটি দেখতে পান, যদি অ্যাড-অনটি তার অ্যাকাউন্টে আগে থেকেই ইনস্টল করা থাকে।

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

চিত্র ১. শিক্ষক একটি নতুন অ্যাসাইনমেন্টের লিঙ্ক সংযুক্তি নির্বাচন করছেন।

চিত্র ২. শিক্ষক তৃতীয় কোনো উৎস থেকে একটি লিঙ্ক পেস্ট করছেন। শিক্ষক ইতিমধ্যেই তৃতীয় পক্ষের ক্লাসরুম অ্যাড-অনটি ইনস্টল করেছেন।

চিত্র ৩। তৃতীয় পক্ষের ডেভেলপার কর্তৃক নির্দিষ্ট করা কোনো রেগুলার এক্সপ্রেশনের সাথে পেস্ট করা লিঙ্কটি মিলে গেলে শিক্ষকের সামনে প্রদর্শিত ইন্টারেক্টিভ ডায়ালগ।

যদি কোনো শিক্ষক চিত্র ৩-এ দেখানো পপ-আপ উইন্ডোতে 'এখনই চেষ্টা করুন' নির্বাচন করেন, তাহলে তাঁকে আপনার অ্যাড-অনের অ্যাটাচমেন্ট ডিসকভারি আইফ্রেম- এ পুনঃনির্দেশিত করা হবে।