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

আরও সমন্বিত অভিজ্ঞতার জন্য ইনস্টল করা PWA-গুলোকে URL পরিচালনার দায়িত্ব দিন।

টমাস স্টেইনার

ইউআরএল হ্যান্ডলার হিসেবে পিডব্লিউএ বলতে কী বোঝায়?

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

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

ইউআরএল হ্যান্ডলার হিসেবে পিডব্লিউএ-তে দুটি সংযোজন রয়েছে:

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

ইউআরএল হ্যান্ডলার হিসেবে পিডব্লিউএ ব্যবহারের প্রস্তাবিত ক্ষেত্রসমূহ

যেসব সাইট এই এপিআই ব্যবহার করতে পারে তার উদাহরণ হলো:

  • মিউজিক বা ভিডিও স্ট্রিমিং সাইটগুলোতে ট্র্যাক লিঙ্ক বা প্লেলিস্ট লিঙ্কগুলো অ্যাপের প্লেয়ার এক্সপেরিয়েন্সে খোলে।
  • নিউজ বা আরএসএস রিডারের মাধ্যমে ফলো করা বা সাবস্ক্রাইব করা সাইটগুলো অ্যাপের রিডার মোডে খুলে যায়।

ইউআরএল হ্যান্ডলার হিসেবে পিডব্লিউএ কীভাবে ব্যবহার করবেন

about://flags দিয়ে সক্রিয় করুন

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

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

ইনস্টল করা কোনো PWA-কে URL প্যাটার্নের সাথে যুক্ত করতে হলে, এই প্যাটার্নগুলোকে ওয়েব অ্যাপ ম্যানিফেস্টে উল্লেখ করতে হবে। এটি "url_handlers" মেম্বারের মাধ্যমে করা হয়। এটি একটি অবজেক্ট অ্যারে গ্রহণ করে, যার একটি origin ' প্রপার্টি থাকে। এই '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-টি তার পরিচালনা করার জন্য প্রয়োজনীয় কিছু URL (যেমন, https://🎵.example.com ) থেকে ভিন্ন একটি অরিজিনে ( music.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 অরিজিনে হোস্ট করা হবে এবং এর ওয়েব অ্যাপ ম্যানিফেস্ট URL দ্বারা চিহ্নিত music.example.com PWA-এর সাথে অ্যাসোসিয়েশন স্থাপন করবে।

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

কখন একটি URL মিলে যায়?

একটি PWA হ্যান্ডলিংয়ের জন্য একটি URL-কে ম্যাচ করে, যদি নিম্নলিখিত উভয় শর্তই পূরণ হয়:

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

web-app-origin-association ফাইল আবিষ্কার সংক্রান্ত

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

ডেমো

PWA-কে URL হ্যান্ডলার হিসেবে পরীক্ষা করতে, নির্দেশিত পদ্ধতি অনুযায়ী ব্রাউজার ফ্ল্যাগ সেট করুন এবং তারপর https://mandymsft.github.io/pwa/ থেকে PWA-টি ইনস্টল করুন। এর ওয়েব অ্যাপ ম্যানিফেস্ট দেখলে আপনি বুঝতে পারবেন যে এটি নিম্নলিখিত 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-এর পাশে থাকা উইন্ডোজ স্কাইপ ইনস্ট্যান্ট মেসেঞ্জার অ্যাপটি, যা একটি স্কাইপ চ্যাট মেসেজে এর দ্বারা পরিচালিত কোনো লিঙ্কে ক্লিক করার পর স্ট্যান্ডঅ্যালোন মোডে খোলে।

নিরাপত্তা এবং অনুমতি

ক্রোমিয়াম টিম ' Controlling Access to Powerful Web Platform Features'- এ সংজ্ঞায়িত মূল নীতিগুলি, যেমন—ব্যবহারকারীর নিয়ন্ত্রণ, স্বচ্ছতা এবং ব্যবহার-বান্ধবতার উপর ভিত্তি করে, ইউআরএল হ্যান্ডলার হিসেবে পিডব্লিউএ (PWA) ডিজাইন ও বাস্তবায়ন করেছে।

ব্যবহারকারীর নিয়ন্ত্রণ

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

স্বচ্ছতা

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

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

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

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

প্রতিক্রিয়া

ইউআরএল হ্যান্ডলার হিসেবে পিডব্লিউএ ব্যবহারের ক্ষেত্রে আপনার অভিজ্ঞতা সম্পর্কে ক্রোমিয়াম টিম জানতে আগ্রহী।

এপিআই ডিজাইন সম্পর্কে আমাদের বলুন

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

বাস্তবায়নে কোনো সমস্যা থাকলে রিপোর্ট করুন।

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

এপিআই-এর প্রতি সমর্থন দেখান

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

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

সহায়ক লিঙ্ক

কৃতজ্ঞতা স্বীকার

মাইক্রোসফট এজ টিমের লু হুয়াং এবং ম্যান্ডি চেন ইউআরএল হ্যান্ডলার হিসেবে পিডব্লিউএ (PWA) নির্দিষ্ট ও বাস্তবায়ন করেছেন। এই নথিটি জো মেডলি পর্যালোচনা করেছেন।