ইনস্টল করা ওয়েব অ্যাপ্লিকেশনগুলিকে ফাইল হ্যান্ডলার হতে দিন

অপারেটিং সিস্টেমের সাথে একটি ফাইল হ্যান্ডলার হিসেবে একটি অ্যাপ নিবন্ধন করুন।

এখন যেহেতু ওয়েব অ্যাপগুলি ফাইল পড়তে এবং লিখতে সক্ষম , তাই পরবর্তী যৌক্তিক পদক্ষেপ হল ডেভেলপারদের তাদের অ্যাপগুলি তৈরি এবং প্রক্রিয়া করতে পারে এমন ফাইলগুলির জন্য এই ওয়েব অ্যাপগুলিকে ফাইল হ্যান্ডলার হিসাবে ঘোষণা করতে দেওয়া। ফাইল হ্যান্ডলিং API আপনাকে ঠিক এটি করার অনুমতি দেয়। একটি টেক্সট এডিটর অ্যাপকে ফাইল হ্যান্ডলার হিসাবে নিবন্ধন করার পরে এবং এটি ইনস্টল করার পরে, আপনি macOS-এ একটি .txt ফাইলে ডান-ক্লিক করতে পারেন এবং "তথ্য পান" নির্বাচন করতে পারেন যাতে OS-কে নির্দেশ দেওয়া যায় যে এটি সর্বদা এই অ্যাপটি ডিফল্ট হিসাবে রেখে .txt ফাইলগুলি খুলবে।

ফাইল হ্যান্ডলিং API-এর জন্য প্রস্তাবিত ব্যবহারের কেস

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

  • অফিস অ্যাপ্লিকেশন যেমন টেক্সট এডিটর, স্প্রেডশিট অ্যাপ এবং স্লাইডশো ক্রিয়েটর।
  • গ্রাফিক্স সম্পাদক এবং অঙ্কন সরঞ্জাম।
  • ভিডিও গেম লেভেল এডিটর টুল।

ফাইল হ্যান্ডলিং API কীভাবে ব্যবহার করবেন

প্রগতিশীল বর্ধন

ফাইল হ্যান্ডলিং API নিজেই পলিফিল করা যাবে না। তবে, ওয়েব অ্যাপ দিয়ে ফাইল খোলার কার্যকারিতা দুটি অন্য উপায়ে অর্জন করা যেতে পারে:

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

ব্রাউজার সাপোর্ট

Browser Support

  • ক্রোম: ১০২।
  • প্রান্ত: ১০২।
  • ফায়ারফক্স: সমর্থিত নয়।
  • সাফারি: সমর্থিত নয়।

Source

বৈশিষ্ট্য সনাক্তকরণ

ফাইল হ্যান্ডলিং API সমর্থিত কিনা তা পরীক্ষা করতে, ব্যবহার করুন:

if ('launchQueue' in window && 'files' in LaunchParams.prototype) {
  // The File Handling API is supported.
}

ফাইল হ্যান্ডলিং API এর ঘোষণামূলক অংশ

প্রথম ধাপ হিসেবে, ওয়েব অ্যাপগুলিকে তাদের ওয়েব অ্যাপ ম্যানিফেস্টে ঘোষণামূলকভাবে বর্ণনা করতে হবে যে তারা কী ধরণের ফাইল পরিচালনা করতে পারে। ফাইল হ্যান্ডলিং API ওয়েব অ্যাপ ম্যানিফেস্টকে "file_handlers" নামক একটি নতুন বৈশিষ্ট্য দিয়ে প্রসারিত করে যা, ভাল, ফাইল হ্যান্ডলারের একটি অ্যারে গ্রহণ করে। একটি ফাইল হ্যান্ডলার হল এই বৈশিষ্ট্যগুলির সাথে একটি বস্তু:

  • একটি "action" প্রপার্টি যা অ্যাপের আওতার মধ্যে থাকা একটি URL-কে তার মান হিসেবে নির্দেশ করে।
  • একটি "accept" বৈশিষ্ট্য যেখানে MIME-টাইপের একটি অবজেক্ট কী হিসেবে এবং ফাইল এক্সটেনশনের তালিকা তাদের মান হিসেবে থাকবে।
  • ImageResource আইকনগুলির একটি অ্যারে সহ একটি "icons" বৈশিষ্ট্য। কিছু অপারেটিং সিস্টেম একটি ফাইল টাইপ অ্যাসোসিয়েশনকে এমন একটি আইকন প্রদর্শন করতে দেয় যা কেবল সংশ্লিষ্ট অ্যাপ্লিকেশন আইকন নয়, বরং অ্যাপ্লিকেশনের সাথে সেই ফাইল টাইপের ব্যবহারের সাথে সম্পর্কিত একটি বিশেষ আইকন।
  • একটি "launch_type" বৈশিষ্ট্য যা নির্ধারণ করে যে একাধিক ফাইল একক ক্লায়েন্টে খোলা উচিত নাকি একাধিক ক্লায়েন্টে। ডিফল্ট হল "single-client" । যদি ব্যবহারকারী একাধিক ফাইল খোলে এবং ফাইল হ্যান্ডলারটি "multiple-clients" এর "launch_type" হিসাবে টীকাযুক্ত থাকে, তাহলে একাধিক অ্যাপ লঞ্চ ঘটবে এবং প্রতিটি লঞ্চের জন্য, LaunchParams.files অ্যারে ( আরও নীচে দেখুন) শুধুমাত্র একটি উপাদান থাকবে।

নীচের উদাহরণটি, ওয়েব অ্যাপ ম্যানিফেস্টের শুধুমাত্র প্রাসঙ্গিক অংশটি দেখানোর মাধ্যমে, এটি আরও স্পষ্ট করে তোলা উচিত:

{
  "file_handlers": [
    {
      "action": "/open-csv",
      "accept": {
        "text/csv": [".csv"]
      },
      "icons": [
        {
          "src": "csv-icon.png",
          "sizes": "256x256",
          "type": "image/png"
        }
      ],
      "launch_type": "single-client"
    },
    {
      "action": "/open-svg",
      "accept": {
        "image/svg+xml": ".svg"
      },
      "icons": [
        {
          "src": "svg-icon.png",
          "sizes": "256x256",
          "type": "image/png"
        }
      ],
      "launch_type": "single-client"
    },
    {
      "action": "/open-graf",
      "accept": {
        "application/vnd.grafr.graph": [".grafr", ".graf"],
        "application/vnd.alternative-graph-app.graph": ".graph"
      },
      "icons": [
        {
          "src": "graf-icon.png",
          "sizes": "256x256",
          "type": "image/png"
        }
      ],
      "launch_type": "multiple-clients"
    }
  ]
}

এটি একটি কাল্পনিক অ্যাপ্লিকেশনের জন্য যা /open-csv এ কমা-বিভাজিত মান ( .csv ) ফাইল, /open-svg এ স্কেলেবল ভেক্টর গ্রাফিক্স ( .svg ) ফাইল এবং /open-graf এ এক্সটেনশন হিসেবে .grafr , .graf , অথবা .graph সহ একটি তৈরি Grafr ফাইল ফর্ম্যাট পরিচালনা করে। প্রথম দুটি একক ক্লায়েন্টে খুলবে, যদি একাধিক ফাইল পরিচালনা করা হয় তবে শেষটি একাধিক ক্লায়েন্টে খুলবে।

ফাইল হ্যান্ডলিং API এর অপরিহার্য অংশ

এখন যেহেতু অ্যাপটি তত্ত্বগতভাবে কোন ইন-স্কোপ URL-এ কোন ফাইল পরিচালনা করতে পারে তা ঘোষণা করেছে, তাই বাস্তবে ইনকামিং ফাইলগুলির সাথে এটিকে অবশ্যই কিছু করতে হবে। এখানেই launchQueue কার্যকর হয়। লঞ্চ করা ফাইলগুলি অ্যাক্সেস করার জন্য, একটি সাইটকে window.launchQueue অবজেক্টের জন্য একটি ভোক্তা নির্দিষ্ট করতে হবে। লঞ্চগুলি নির্দিষ্ট ভোক্তা দ্বারা পরিচালনা না করা পর্যন্ত সারিবদ্ধ থাকে, যা প্রতিটি লঞ্চের জন্য ঠিক একবার আহ্বান করা হয়। এই পদ্ধতিতে, প্রতিটি লঞ্চ পরিচালনা করা হয়, গ্রাহক কখন নির্দিষ্ট করা হয়েছিল তা নির্বিশেষে।

if ('launchQueue' in window && 'files' in LaunchParams.prototype) {
  launchQueue.setConsumer((launchParams) => {
    // Nothing to do when the queue is empty.
    if (!launchParams.files.length) {
      return;
    }
    for (const fileHandle of launchParams.files) {
      // Handle the file.
    }
  });
}

DevTools সাপোর্ট

এই লেখার সময় DevTools-এ কোনও সাপোর্ট নেই, তবে আমি সাপোর্ট যোগ করার জন্য একটি ফিচার অনুরোধ জমা দিয়েছি।

ডেমো

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

এক্সক্যালিড্রাও ফাইল সহ ম্যাকওএস ফাইন্ডার উইন্ডো।
আপনার অপারেটিং সিস্টেমের ফাইল এক্সপ্লোরারে একটি ফাইলে ডাবল ক্লিক করুন অথবা রাইট ক্লিক করুন।
Open with… Excalidraw আইটেমটি হাইলাইট করে একটি ফাইলে ডান ক্লিক করলে যে প্রসঙ্গ মেনুটি প্রদর্শিত হয়।
.excalidraw ফাইলের জন্য Excalidraw হল ডিফল্ট ফাইল হ্যান্ডলার।

নিরাপত্তা

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

অনুমতি, অনুমতির স্থায়িত্ব, এবং ফাইল হ্যান্ডলার আপডেট

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

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

"file_handlers" বিভাগে ম্যানিফেস্ট আপডেট এবং পরিবর্তনগুলি সনাক্ত করা হলে, অনুমতিগুলি পুনরায় সেট করা হবে।

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

ব্যবহারকারীরা অনিচ্ছাকৃতভাবে কোনও ওয়েব অ্যাপ্লিকেশনকে কোনও ফাইল খোলার মাধ্যমে অ্যাক্সেস দেওয়ার ঝুঁকি রাখে। তবে, সাধারণত এটি বোঝা যায় যে কোনও ফাইল খোলার মাধ্যমে যে অ্যাপ্লিকেশনটি এটি দিয়ে খোলা হচ্ছে সে ফাইলটি পড়তে এবং/অথবা ম্যানিপুলেট করতে সক্ষম হয়। অতএব, কোনও ইনস্টল করা অ্যাপ্লিকেশনে, যেমন "ওপেন উইথ..." প্রসঙ্গ মেনু ব্যবহার করে, কোনও ব্যবহারকারীর স্পষ্ট পছন্দ অ্যাপ্লিকেশনটির উপর আস্থার যথেষ্ট সংকেত হিসাবে পড়া যেতে পারে।

ডিফল্ট হ্যান্ডলার চ্যালেঞ্জ

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

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

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

স্বচ্ছতা

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

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

Chrome টিম ফাইল হ্যান্ডলিং API এর সাথে আপনার অভিজ্ঞতা সম্পর্কে শুনতে চায়।

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

API-তে কি এমন কিছু আছে যা আপনার প্রত্যাশা অনুযায়ী কাজ করছে না? নাকি আপনার ধারণা বাস্তবায়নের জন্য প্রয়োজনীয় কোনও পদ্ধতি বা বৈশিষ্ট্য অনুপস্থিত? নিরাপত্তা মডেল সম্পর্কে আপনার কোন প্রশ্ন বা মন্তব্য আছে?

  • সংশ্লিষ্ট GitHub রেপোতে একটি স্পেক সমস্যা ফাইল করুন, অথবা বিদ্যমান কোনও সমস্যায় আপনার মতামত যোগ করুন।

বাস্তবায়নে কোনও সমস্যার কথা জানান

আপনি কি Chrome এর বাস্তবায়নে কোন বাগ খুঁজে পেয়েছেন? নাকি বাস্তবায়নটি স্পেসিফিকেশন থেকে আলাদা?

  • new.crbug.com এ একটি বাগ ফাইল করুন। যতটা সম্ভব বিস্তারিত তথ্য, পুনরুৎপাদনের জন্য সহজ নির্দেশাবলী অন্তর্ভুক্ত করতে ভুলবেন না এবং Components বাক্সে UI>Browser>WebAppInstalls>FileHandling লিখুন।

API এর জন্য সমর্থন দেখান

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

  • আপনি কীভাবে এটি ব্যবহার করার পরিকল্পনা করছেন তা WICG ডিসকোর্স থ্রেডে শেয়ার করুন।
  • #FileHandling হ্যাশট্যাগ ব্যবহার করে @ChromiumDev- এ একটি টুইট পাঠান এবং আপনি এটি কোথায় এবং কীভাবে ব্যবহার করছেন তা আমাদের জানান।

সহায়ক লিঙ্ক

স্বীকৃতি

ফাইল হ্যান্ডলিং API এরিক উইলিগার্স , জে হ্যারিস এবং রেমস খুরি দ্বারা নির্দিষ্ট করা হয়েছিল। এই নিবন্ধটি জো মেডলি দ্বারা পর্যালোচনা করা হয়েছিল।