URL হ্যান্ডলার হিসেবে PWA

আরও ইন্টিগ্রেটেড অভিজ্ঞতার জন্য ইনস্টল করা PWA-কে URL ম্যানেজ করতে দিন।

URL হ্যান্ডলার হিসেবে PWAs কী?

মনে করুন, আপনি macOS-এ Messages-এর মতো ইনস্ট্যান্ট মেসেঞ্জার অ্যাপ্লিকেশন ব্যবহার করে কোনও বন্ধুর সাথে চ্যাট করছেন এবং আপনারা মিউজিক নিয়ে কথা বলছেন। আরও কল্পনা করুন যে আপনাদের দুজনের ডিভাইসেই music.example.com PWA ইনস্টল করা আছে। আপনার বন্ধুকে পছন্দের ট্র্যাক শেয়ার করতে চাইলে, আপনি তাকে https://music.example.com/rick-astley/never-gonna-give-you-up-এর মতো ডিপ লিঙ্ক পাঠাতে পারেন। এই লিঙ্কটি বেশ বড় হওয়ার কারণে, music.example.com-এর ডেভেলপাররা প্রতিটি ট্র্যাকের জন্য একটি অতিরিক্ত ছোট লিঙ্ক যোগ করার সিদ্ধান্ত নিয়ে থাকতে পারেন, যেমন, https://🎵.example.com/r-a/n-g-g-y-u।

URL হ্যান্ডলার হিসেবে PWA, music.example.com-এর মতো অ্যাপকে https://music.example.com, https://*.music.example.com বা https://🎵.example.com-এর মতো প্যাটার্নের সাথে ম্যাচ করে এমন URL-এর জন্য URL হ্যান্ডলার হিসেবে নিজেকে রেজিস্টার করার অনুমতি দেয়, যাতে PWA-এর বাইরে থেকে আসা লিঙ্ক, যেমন, ইনস্ট্যান্ট মেসেঞ্জার অ্যাপ্লিকেশন বা ইমেল ক্লায়েন্ট থেকে আসা লিঙ্ক, ব্রাউজার ট্যাবের পরিবর্তে ইনস্টল করা PWA-তে খোলে।

URL হ্যান্ডলার হিসেবে পিডব্লুএ(PWA)-তে দুটি অতিরিক্ত সুবিধা আছে:

  1. "url_handlers" ওয়েব অ্যাপ ম্যানিফেস্ট মেম্বার।
  2. ইন-স্কোপ ও আউট-অফ-স্কোপ URL অ্যাসোসিয়েশন যাচাই করার জন্য web-app-origin-association ফাইল ফর্ম্যাট।

URL হ্যান্ডলার হিসেবে PWA-এর জন্য সাজেস্ট করা ব্যবহারের ক্ষেত্র

এই API ব্যবহার করতে পারে এমন সাইটের উদাহরণের মধ্যে রয়েছে:

  • মিউজিক বা ভিডিও স্ট্রিমিং সাইট যাতে ট্র্যাক লিঙ্ক বা প্লেলিস্ট লিঙ্ক অ্যাপের প্লেয়ার অভিজ্ঞতায় খোলে।
  • খবর বা RSS রিডার যাতে ফলো করা বা সাবস্ক্রাইব করা সাইট অ্যাপের রিডার মোডে খোলে।

URL হ্যান্ডলার হিসেবে কীভাবে PWA ব্যবহার করবেন

about://flags-এর মাধ্যমে চালু করুন

URL হ্যান্ডলার হিসেবে PWA-এর সাথে লোকালভাবে পরীক্ষা করতে, অরিজিন ট্রায়াল টোকেন ছাড়াই, #enable-desktop-pwas-url-handling ফ্ল্যাগ about://flags-এ চালু করুন।

"url_handlers" ওয়েব অ্যাপ ম্যানিফেস্ট মেম্বার

URL প্যাটার্নের সাথে ইনস্টল করা PWA অ্যাসোসিয়েট করতে, এই প্যাটার্নগুলি ওয়েব অ্যাপ ম্যানিফেস্টে উল্লেখ করতে হবে। এটি "url_handlers" মেম্বারের মাধ্যমে হয়। এটি origin প্রপার্টি সহ অবজেক্টের একটি অ্যারে গ্রহণ করে, যা একটি প্রয়োজনীয় string যা উৎস মেলানোর জন্য একটি প্যাটার্ন। একাধিক সাব-ডোমেন (যেমন, https://*.example.com) অন্তর্ভুক্ত করার জন্য এইসব প্যাটার্নে ওয়াইল্ডকার্ড (*) প্রিফিক্স ব্যবহার করার অনুমতি দেওয়া হয়। এইসব অরিজিনের সাথে ম্যাচ করা URL এই ওয়েব অ্যাপের মাধ্যমে ম্যানেজ করা যেতে পারে। স্কিমটি সবসময় https:// হিসেবে ধরে নেওয়া হয়, তবে এটি স্পষ্টভাবে উল্লেখ করতে হবে।

ওয়েব অ্যাপ ম্যানিফেস্টের নিম্নলিখিত উদ্ধৃতি থেকে বোঝা যায় যে ভূমিকা অনুচ্ছেদে দেওয়া মিউজিক PWA-এর উদাহরণ কীভাবে এটি সেট-আপ করতে পারে। ওয়াইল্ডকার্ড ("https://*.music.example.com") সহ দ্বিতীয় এন্ট্রি নিশ্চিত করে যে অ্যাপটি https://www.music.example.com বা https://marketing-activity.music.example.com-এর মতো অন্যান্য সম্ভাব্য উদাহরণের জন্যও অ্যাক্টিভেট করা হয়েছে।

{
  "url_handlers": [
    {
      "origin": "https://music.example.com"
    },
    {
      "origin": "https://*.music.example.com"
    },
    {
      "origin": "https://🎵.example.com"
    }
  ]
}

web-app-origin-association ফাইল

যেহেতু PWA-এর অরিজিন (music.example.com) এবং এটি যে URL ম্যানেজ করে (যেমন, https://🎵.example.com) তার অরিজিন আলাদা, তাই অ্যাপটিকে এই অন্যান্য অরিজিনের মালিকানা যাচাই করতে হবে। অন্য অরিজিনে হোস্ট করা web-app-origin-association ফাইলে এটি ঘটে।

এই ফাইলে সঠিক JSON থাকতে হবে। টপ-লেভেল স্ট্রাকচার হল একটি অবজেক্ট, যার মেম্বারের নাম "web_apps"। এই মেম্বার হল অবজেক্টের একটি অ্যারে এবং প্রতিটি অবজেক্ট অনন্য ওয়েব অ্যাপের জন্য একটি এন্ট্রিকে দেখায়। প্রতিটি অবজেক্টে এগুলি থাকে:

ফিল্ড বিবরণ ধরন ডিফল্ট
"manifest" (প্রয়োজনীয়) সংশ্লিষ্ট PWA-এর ওয়েব অ্যাপ ম্যানিফেস্টের URL স্ট্রিং string প্রযোজ্য নয়
"details" (ঐচ্ছিক) এমন একটি অবজেক্ট যাতে অন্তর্ভুক্ত ও বাদ দেওয়া URL প্যাটার্নের অ্যারে আছে object প্রযোজ্য নয়

প্রতিটি "details" অবজেক্টে এগুলি থাকে:

ফিল্ড বিবরণ ধরন ডিফল্ট
"paths" (ঐচ্ছিক) অনুমোদিত পাথ স্ট্রিংয়ের অ্যারে string[] []
"exclude_paths" (ঐচ্ছিক) অননুমোদিত পাথ স্ট্রিংয়ের অ্যারে string[] []

উপরে দেওয়া মিউজিক PWA-এর উদাহরণের জন্য একটি web-app-origin-association ফাইলের উদাহরণ নিচে দেওয়া হল। এটি 🎵.example.com অরিজিনে হোস্ট করা হবে এবং music.example.com PWA-এর সাথে অ্যাসোসিয়েশন তৈরি করবে, যা এর ওয়েব অ্যাপ ম্যানিফেস্ট URL-এর মাধ্যমে শনাক্ত করা হয়।

{
  "web_apps": [
    {
      "manifest": "https://music.example.com/manifest.json",
      "details": {
        "paths": ["/*"],
        "exclude_paths": ["/internal/*"]
      }
    }
  ]
}

URL কখন ম্যাচ করে?

নিম্নলিখিত দুটি শর্ত পূরণ হলে, কোনও PWA ম্যানেজ করার জন্য URL-এর সাথে ম্যাচ করে:

  • URL-টি "url_handlers"-এর অরিজিন স্ট্রিংয়ের একটির সাথে মিলে যায়।
  • ব্রাউজার সংশ্লিষ্ট web-app-origin-association ফাইল ব্যবহার করে যাচাই করতে পারে যে প্রতিটি অরিজিন এই অ্যাপকে এই ধরনের URL ম্যানেজ করার অনুমতি দিতে সম্মত হয়েছে।

web-app-origin-association ফাইল খোঁজা সংক্রান্ত

ব্রাউজার যাতে web-app-origin-association ফাইলটি খুঁজে পায়, তার জন্য ডেভেলপারকে web-app-origin-association ফাইলটি অ্যাপের রুটে /.well-known/ ফোল্ডারে রাখতে হবে। এটি কাজ করার জন্য, ফাইলের নাম অবশ্যই web-app-origin-association হতে হবে।

ডেমো

URL হ্যান্ডলার হিসেবে পিডব্লুএ(PWA) পরীক্ষা করতে, আউটলাইন করা অনুযায়ী ব্রাউজার ফ্ল্যাগ সেট করুন এবং তারপর https://mandymsft.github.io/pwa/-এ পিডব্লুএ(PWA) ইনস্টল করুন। এটির ওয়েব অ্যাপ ম্যানিফেস্ট দেখলে আপনি বুঝতে পারবেন যে এটি নিম্নলিখিত URL প্যাটার্ন সহ URL ম্যানেজ করে: https://mandymsft.github.io এবং https://luhuangmsft.github.io. যেহেতু পরেরটি PWA-এর থেকে আলাদা অরিজিনে (luhuangmsft.github.io) আছে, তাই mandymsft.github.io-এ থাকা PWA-কে মালিকানা প্রমাণ করতে হবে, যা https://luhuangmsft.github.io/.well-known/web-app-origin-association-এ হোস্ট করা web-app-origin-association ফাইল ব্যবহার করে করা হয়।

এটি সত্যিই কাজ করছে কিনা তা পরীক্ষা করতে, আপনার পছন্দের একটি ইনস্ট্যান্ট মেসেজিং অ্যাপ ব্যবহার করে নিজেকে একটি টেস্ট মেসেজ পাঠান বা macOS-এ Mail-এর মতো ওয়েব-ভিত্তিক নয় এমন একটি ইমেল ক্লায়েন্টে দেখা একটি ইমেল পাঠান। ইমেল বা টেক্সট মেসেজে https://mandymsft.github.io বা https://luhuangmsft.github.io লিঙ্কের মধ্যে যেকোনও একটি থাকতে হবে। ইনস্টল করা PWA-তে দুটিই খুলতে হবে।

ইনস্টল করা ডেমো PWA-এর পাশে Windows Skype ইনস্ট্যান্ট মেসেঞ্জার অ্যাপ, যা Skype চ্যাট মেসেজে এর দ্বারা ম্যানেজ করা লিঙ্কে ক্লিক করার পরে স্ট্যান্ডঅ্যালোন মোডে খোলা হয়।

নিরাপত্তা ও অনুমতি

Chromium টিম শক্তিশালী ওয়েব প্ল্যাটফর্ম ফিচারে অ্যাক্সেস কন্ট্রোল করা-তে সংজ্ঞায়িত মূল নীতি ব্যবহার করে URL হ্যান্ডলার হিসেবে PWA ডিজাইন ও প্রয়োগ করেছে, যার মধ্যে ব্যবহারকারীর কন্ট্রোল, স্বচ্ছতা ও কর্মদক্ষতা অন্তর্ভুক্ত।

ব্যবহারকারীর কন্ট্রোল

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

স্বচ্ছতা

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

প্ল্যাটফর্ম-নির্দিষ্ট অ্যাপ্লিকেশনগুলি ইতিমধ্যেই ব্যবহারকারীর সিস্টেমে ইনস্টল করা অ্যাপ্লিকেশনগুলি গণনা করতে অপারেটিং সিস্টেম API ব্যবহার করতে পারে। যেমন, Windows-এ অ্যাপ্লিকেশন FindAppUriHandlersAsync API ব্যবহার করে URL হ্যান্ডলারের তালিকা তৈরি করতে পারে। Windows-এ OS লেভেল URL হ্যান্ডলার হিসেবে PWA রেজিস্টার করলে, অন্যান্য অ্যাপ্লিকেশন তার উপস্থিতি দেখতে পাবে।

অনুমতির স্থায়িত্ব

কোনও অরিজিন যেকোনও সময় PWA-এর সাথে তার অ্যাসোসিয়েশন পরিবর্তন করতে পারে। ব্রাউজার নিয়মিতভাবে ইনস্টল করা ওয়েব অ্যাপের অ্যাসোসিয়েশন আবার যাচাই করার চেষ্টা করবে। অ্যাসোসিয়েশন ডেটা পরিবর্তন হয়ে গেলে বা আর উপলভ্য না থাকার কারণে URL হ্যান্ডলার রেজিস্ট্রেশন আবার যাচাই করতে না পারলে, ব্রাউজার রেজিস্ট্রেশন সরিয়ে দেবে।

মতামত

URL হ্যান্ডলার হিসেবে PWA-এর সাথে আপনার অভিজ্ঞতা সম্পর্কে Chromium টিম জানতে চায়।

API ডিজাইন সম্পর্কে আমাদের জানান

API-এর এমন কিছু আছে কি যা আপনার প্রত্যাশা মতো কাজ করে না? অথবা আপনার আইডিয়া প্রয়োগ করার জন্য প্রয়োজনীয় পদ্ধতি বা প্রপার্টি কি উপলভ্য নেই? নিরাপত্তা মডেল সম্পর্কে কোনও প্রশ্ন বা মন্তব্য আছে? সংশ্লিষ্ট GitHub রেপো-তে স্পেক সংক্রান্ত সমস্যা ফাইল করুন অথবা আগে থেকে থাকা কোনও সমস্যা সম্পর্কে আপনার মতামত যোগ করুন।

প্রয়োগ সংক্রান্ত সমস্যা সম্পর্কে অভিযোগ জানানো

Chromium-এর ইমপ্লিমেন্টেশনে আপনি কি কোনও সমস্যা খুঁজে পেয়েছেন? নাকি স্পেসিফিকেশন থেকে ইমপ্লিমেন্টেশন আলাদা? new.crbug.com-এ গিয়ে বাগ সম্পর্কে অভিযোগ জানান। যতটা সম্ভব বিস্তারিত তথ্য, সমস্যাটি আবার তৈরি করার নির্দেশাবলী অন্তর্ভুক্ত করতে ভুলবেন না এবং কম্পোনেন্ট বক্সে UI>Browser>WebAppInstalls লিখুন।

API-এর জন্য সহায়তা দেখান

আপনি কি URL হ্যান্ডলার হিসেবে PWA ব্যবহার করার পরিকল্পনা করছেন? আপনার সর্বজনীন সমর্থন Chromium টিমকে ফিচারগুলিকে অগ্রাধিকার দিতে সাহায্য করে এবং অন্যান্য ব্রাউজার ভেন্ডরদের দেখায় যে তাদের সমর্থন করা কতটা গুরুত্বপূর্ণ।

হ্যাশট্যাগ #URLHandlers ব্যবহার করে @ChromiumDev-এ টুইট করুন এবং আপনি কোথায় ও কীভাবে এটি ব্যবহার করছেন তা আমাদের জানান।

সহায়ক লিঙ্ক

স্বীকৃতি

URL হ্যান্ডলার হিসেবে পিডব্লুএ(PWA) নির্দিষ্ট এবং প্রয়োগ করেছেন Lu Huang এবং Mandy Chen Microsoft Edge টিম থেকে। এই ডকুমেন্ট Joe Medley পর্যালোচনা করেছেন।