इंस्टॉल किए गए वेब ऐप्लिकेशन को फ़ाइल हैंडलर बनने की अनुमति दें

ऑपरेटिंग सिस्टम के साथ किसी ऐप्लिकेशन को फ़ाइल हैंडलर के तौर पर रजिस्टर करना.

Thomas Steiner

अब वेब ऐप्लिकेशन फ़ाइलें पढ़ और लिख सकते हैं. इसलिए, अगला सही कदम यह है कि डेवलपर इन वेब ऐप्लिकेशन को फ़ाइल हैंडलर के तौर पर घोषित करें. इससे, वेब ऐप्लिकेशन उन फ़ाइलों को बना और प्रोसेस कर पाएंगे. फ़ाइल मैनेज करने वाले एपीआई की मदद से, ऐसा किया जा सकता है. टेक्स्ट एडिटर ऐप्लिकेशन को फ़ाइल हैंडलर के तौर पर रजिस्टर करने और उसे इंस्टॉल करने के बाद, macOS पर किसी .txt फ़ाइल पर राइट क्लिक करके "जानकारी पाएं" को चुनें. इसके बाद, ओएस को निर्देश दें कि वह डिफ़ॉल्ट रूप से .txt फ़ाइलों को इस ऐप्लिकेशन से खोले.

फ़ाइल हैंडलिंग एपीआई के इस्तेमाल के सुझाए गए उदाहरण

इस एपीआई का इस्तेमाल करने वाली साइटों के उदाहरणों में ये शामिल हैं:

• ऑफ़िस ऐप्लिकेशन, जैसे कि टेक्स्ट एडिटर, स्प्रेडशीट ऐप्लिकेशन, और स्लाइड शो बनाने वाले ऐप्लिकेशन.
• ग्राफ़िक एडिटर और ड्रॉइंग टूल.
• वीडियो गेम के लेवल एडिटर टूल.

फ़ाइल मैनेज करने वाले एपीआई का इस्तेमाल करने का तरीका

प्रोग्रेसिव एन्हैंसमेंट

फ़ाइल मैनेज करने वाले एपीआई को पॉलीफ़िल नहीं किया जा सकता. हालांकि, वेब ऐप्लिकेशन से फ़ाइलें खोलने की सुविधा को दो अन्य तरीकों से भी ऐक्सेस किया जा सकता है:

• Web Share Target API की मदद से, डेवलपर अपने ऐप्लिकेशन को शेयर टारगेट के तौर पर सेट कर सकते हैं, ताकि ऑपरेटिंग सिस्टम की शेयर शीट से फ़ाइलें खोली जा सकें.
• File System Access API को फ़ाइल को खींचकर छोड़ने की सुविधा के साथ इंटिग्रेट किया जा सकता है, ताकि डेवलपर पहले से खुले ऐप्लिकेशन में, छोड़ी गई फ़ाइलों को मैनेज कर सकें.

ब्राउज़र समर्थन

फ़ीचर का पता लगाना

यह देखने के लिए कि फ़ाइल हैंडलिंग एपीआई काम करता है या नहीं, इनका इस्तेमाल करें:

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

फ़ाइल मैनेज करने वाले एपीआई का एलान करने वाला हिस्सा

सबसे पहले, वेब ऐप्लिकेशन को अपने वेब ऐप्लिकेशन मेनिफ़ेस्ट में साफ़ तौर पर यह बताना होगा कि वे किस तरह की फ़ाइलों को हैंडल कर सकते हैं. फ़ाइल मैनेज करने वाला एपीआई, वेब ऐप्लिकेशन मेनिफ़ेस्ट को "file_handlers" नाम की नई प्रॉपर्टी के साथ बड़ा करता है. यह प्रॉपर्टी, फ़ाइल हैंडलर की एक कलेक्शन स्वीकार करती है. फ़ाइल हैंडलर एक ऐसा ऑब्जेक्ट है जिसमें ये प्रॉपर्टी होती हैं:

• "action" प्रॉपर्टी, जो अपनी वैल्यू के तौर पर ऐप्लिकेशन के दायरे में मौजूद यूआरएल पर ले जाती है.
• "accept" प्रॉपर्टी, जिसमें पासकोड के तौर पर MIME-टाइप का ऑब्जेक्ट और वैल्यू के तौर पर फ़ाइल एक्सटेंशन की सूचियां होती हैं.
• ImageResource आइकॉन के कलेक्शन वाली "icons" प्रॉपर्टी. कुछ ऑपरेटिंग सिस्टम, फ़ाइल टाइप के असोसिएशन को ऐसा आइकॉन दिखाने की अनुमति देते हैं जो सिर्फ़ उससे जुड़े ऐप्लिकेशन का आइकॉन नहीं होता. बल्कि, यह ऐप्लिकेशन के साथ उस फ़ाइल टाइप के इस्तेमाल से जुड़ा एक खास आइकॉन होता है.
• "launch_type" प्रॉपर्टी, यह तय करती है कि एक से ज़्यादा फ़ाइलों को एक क्लाइंट में खोला जाना चाहिए या एक से ज़्यादा क्लाइंट में. डिफ़ॉल्ट रूप से, यह "single-client" पर सेट होता है. अगर उपयोगकर्ता एक से ज़्यादा फ़ाइलें खोलता है और फ़ाइल हैंडलर को "launch_type" के तौर पर "multiple-clients" के साथ एनोटेट किया गया है, तो एक से ज़्यादा ऐप्लिकेशन लॉन्च होंगे. साथ ही, हर लॉन्च के लिए, 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 फ़ाइल फ़ॉर्मैट को हैंडल करता है. अगर एक से ज़्यादा फ़ाइलें हैं, तो पहले दो विकल्प एक ही क्लाइंट में खुलेंगे और आखिरी विकल्प एक से ज़्यादा क्लाइंट में खुलेगा.

फ़ाइल मैनेज करने वाले एपीआई का ज़रूरी हिस्सा

अब ऐप्लिकेशन ने यह एलान कर दिया है कि वह दायरे में आने वाले किस यूआरएल पर कौनसी फ़ाइलें मैनेज कर सकता है. अब उसे ज़रूर से, आने वाली फ़ाइलों के साथ कुछ करना होगा. यहां launchQueue का इस्तेमाल किया जाता है. लॉन्च की गई फ़ाइलों को ऐक्सेस करने के लिए, साइट को window.launchQueue ऑब्जेक्ट के लिए एक उपभोक्ता तय करना होगा. लॉन्च तब तक कतार में रहते हैं, जब तक उन्हें तय किए गए उपभोक्ता से मैनेज नहीं किया जाता. हर लॉन्च के लिए, उपभोक्ता को ठीक एक बार कॉल किया जाता है. इस तरह, हर लॉन्च को मैनेज किया जाता है. इस बात से कोई फ़र्क़ नहीं पड़ता कि consumer को कब तय किया गया था.

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 के लिए कोई सहायता उपलब्ध नहीं है. हालांकि, मैंने सहायता जोड़ने के लिए, सुविधा का अनुरोध दर्ज किया है.

डेमो

मैंने कार्टून स्टाइल में ड्रॉ करने वाले ऐप्लिकेशन Excalidraw में, फ़ाइल मैनेज करने की सुविधा जोड़ी है. इसकी जांच करने के लिए, आपको पहले Excalidraw इंस्टॉल करना होगा. इसके बाद, इसकी मदद से कोई फ़ाइल बनाएं और उसे अपने फ़ाइल सिस्टम में कहीं सेव करें. इसके बाद, फ़ाइल को दो बार क्लिक करके या राइट क्लिक करके खोला जा सकता है. इसके बाद, संदर्भ मेन्यू में "Excalidraw" को चुनें. सोर्स कोड में जाकर, लागू करने की जानकारी देखी जा सकती है.

सुरक्षा

Chrome की टीम ने वेब प्लैटफ़ॉर्म की बेहतर सुविधाओं के ऐक्सेस को कंट्रोल करना में बताए गए मुख्य सिद्धांतों का इस्तेमाल करके, फ़ाइल हैंडलिंग एपीआई को डिज़ाइन और लागू किया है. इन सिद्धांतों में, उपयोगकर्ता कंट्रोल, पारदर्शिता, और काम करने के तरीके शामिल हैं.

अनुमतियां, अनुमतियों के बने रहने की सुविधा, और फ़ाइल हैंडलर से जुड़े अपडेट

उपयोगकर्ताओं का भरोसा जीतने और उनकी फ़ाइलों की सुरक्षा के लिए, फ़ाइल मैनेज करने वाला एपीआई किसी फ़ाइल को खोलने से पहले, अनुमति का अनुरोध दिखाता है. अनुमति का यह अनुरोध, उपयोगकर्ता के फ़ाइल खोलने के लिए PWA चुनने के तुरंत बाद दिखाया जाएगा. इससे अनुमति, PWA का इस्तेमाल करके फ़ाइल खोलने की कार्रवाई से पूरी तरह जुड़ी रहेगी. इससे, अनुमति को समझना और उसे काम का बनाना आसान हो जाएगा.

यह अनुमति तब तक हर बार दिखेगी, जब तक उपयोगकर्ता साइट के लिए फ़ाइल मैनेज करने की अनुमति देने या ब्लॉक करने के लिए अनुमति दें या ब्लॉक करें पर क्लिक नहीं करता या तीन बार प्रॉम्प्ट को अनदेखा नहीं करता. इसके बाद, Chromium इस अनुमति पर पाबंदी लगा देगा और उसे ब्लॉक कर देगा. चुनी गई सेटिंग, PWA को बंद करने और फिर से खोलने पर भी बनी रहेगी.

जब मेनिफ़ेस्ट अपडेट हो जाता है और "file_handlers" सेक्शन में बदलावों का पता चलता है, तो अनुमतियां रीसेट हो जाएंगी.

फ़ाइल से जुड़ी चुनौतियां

हमले के ऐसे कई तरीके हैं जो वेबसाइटों को फ़ाइलों का ऐक्सेस देने पर खुलते हैं. इनके बारे में File System Access API के लेख में बताया गया है. फ़ाइल सिस्टम ऐक्सेस एपीआई के मुकाबले, फ़ाइल मैनेज करने वाले एपीआई में सुरक्षा से जुड़ी एक और सुविधा होती है. इसकी मदद से, ऑपरेटिंग सिस्टम के पहले से मौजूद यूज़र इंटरफ़ेस (यूआई) से कुछ फ़ाइलों को ऐक्सेस किया जा सकता है. इसके बजाय, वेब ऐप्लिकेशन से दिखाए गए फ़ाइल पिकर से फ़ाइलों को ऐक्सेस नहीं किया जा सकता.

हालांकि, अब भी यह जोखिम बना रहता है कि उपयोगकर्ता फ़ाइल को खोलकर, अनजाने में किसी वेब ऐप्लिकेशन को फ़ाइल का ऐक्सेस दे सकते हैं. हालांकि, आम तौर पर यह समझा जाता है कि किसी फ़ाइल को खोलने पर, उस फ़ाइल को पढ़ने और/या उसमें बदलाव करने की अनुमति, उस ऐप्लिकेशन को मिल जाती है जिससे फ़ाइल खोली गई है. इसलिए, अगर कोई उपयोगकर्ता किसी इंस्टॉल किए गए ऐप्लिकेशन में, "इससे खोलें…" कॉन्टेक्स्ट मेन्यू की मदद से फ़ाइल खोलने का विकल्प चुनता है, तो इसे ऐप्लिकेशन पर भरोसे के तौर पर पढ़ा जा सकता है.

डिफ़ॉल्ट हैंडलर से जुड़ी समस्याएं

हालांकि, अगर होस्ट सिस्टम पर किसी फ़ाइल टाइप के लिए कोई ऐप्लिकेशन मौजूद नहीं है, तो यह शर्त लागू नहीं होती. इस मामले में, होस्ट के कुछ ऑपरेटिंग सिस्टम, नए रजिस्टर किए गए हैंडलर को उस फ़ाइल टाइप के लिए डिफ़ॉल्ट हैंडलर के तौर पर अपने-आप प्रमोट कर सकते हैं. ऐसा उपयोगकर्ता के किसी भी इंटरवेंशन के बिना होता है. इसका मतलब है कि अगर उपयोगकर्ता उस टाइप की फ़ाइल पर दो बार क्लिक करता है, तो वह रजिस्टर किए गए वेब ऐप्लिकेशन में अपने-आप खुल जाएगी. ऐसे होस्ट ऑपरेटिंग सिस्टम पर, जब उपयोगकर्ता एजेंट यह पता लगाता है कि फ़ाइल टाइप के लिए कोई डिफ़ॉल्ट हैंडलर मौजूद नहीं है, तो उपयोगकर्ता की सहमति के बिना किसी फ़ाइल के कॉन्टेंट को वेब ऐप्लिकेशन में भेजने से रोकने के लिए, साफ़ तौर पर अनुमति देने का प्रॉम्प्ट ज़रूरी हो सकता है.

उपयोगकर्ता कंट्रोल

स्पेसिफ़िकेशन के मुताबिक, ब्राउज़र को हर उस साइट को फ़ाइल मैनेजर के तौर पर रजिस्टर नहीं करना चाहिए जो फ़ाइलों को मैनेज कर सकती है. इसके बजाय, फ़ाइल हैंडल करने की सुविधा के लिए रजिस्टर करने की प्रक्रिया, इंस्टॉलेशन के बाद शुरू होनी चाहिए. साथ ही, उपयोगकर्ता की साफ़ तौर पर पुष्टि के बिना, यह कभी भी शुरू नहीं होनी चाहिए. खास तौर पर, अगर किसी साइट को डिफ़ॉल्ट हैंडलर बनाना है. साइटों को .json जैसे मौजूदा एक्सटेंशन को हाइजैक करने के बजाय, अपने एक्सटेंशन बनाने चाहिए. ऐसा इसलिए, क्योंकि हो सकता है कि उपयोगकर्ता के पास पहले से ही इन एक्सटेंशन के लिए डिफ़ॉल्ट हैंडलर रजिस्टर हो.

पारदर्शिता

सभी ऑपरेटिंग सिस्टम, उपयोगकर्ताओं को फ़ाइल के मौजूदा असोसिएशन बदलने की अनुमति देते हैं. यह ब्राउज़र के दायरे से बाहर है.

सुझाव/राय दें या शिकायत करें

Chrome की टीम, फ़ाइल मैनेज करने वाले एपीआई के इस्तेमाल से जुड़े आपके अनुभवों के बारे में जानना चाहती है.

हमें एपीआई के डिज़ाइन के बारे में बताएं

क्या एपीआई में कुछ ऐसा है जो आपकी उम्मीद के मुताबिक काम नहीं करता? क्या आपके आइडिया को लागू करने के लिए, कोई तरीका या प्रॉपर्टी मौजूद नहीं है? क्या आपका सुरक्षा मॉडल के बारे में कोई सवाल या टिप्पणी है?

• GitHub repo पर, स्पेसिफ़िकेशन से जुड़ी समस्या दर्ज करें या किसी मौजूदा समस्या में अपने सुझाव जोड़ें.

लागू करने से जुड़ी समस्या की शिकायत करना

क्या आपको Chrome में इस सुविधा को लागू करने में कोई गड़बड़ी मिली? या क्या इसे लागू करने का तरीका, खास जानकारी से अलग है?

• new.crbug.com पर गड़बड़ी की शिकायत करें. इसमें ज़्यादा से ज़्यादा जानकारी शामिल करें. साथ ही, गड़बड़ी को दोहराने के लिए आसान निर्देश दें. इसके बाद, Components बॉक्स में UI>Browser>WebAppInstalls>FileHandling डालें. Glitch, आसानी से और तेज़ी से समस्या की जानकारी शेयर करने के लिए बहुत अच्छा है.

एपीआई के लिए सहायता दिखाना

क्या आपको फ़ाइल मैनेज करने वाले एपीआई का इस्तेमाल करना है? सार्वजनिक तौर पर सहायता करने से, Chrome की टीम को सुविधाओं को प्राथमिकता देने में मदद मिलती है. साथ ही, इससे अन्य ब्राउज़र वेंडर को यह पता चलता है कि इन सुविधाओं को उपलब्ध कराना कितना ज़रूरी है.

• WICG के Discourse थ्रेड पर शेयर करें कि आपको इसका इस्तेमाल कैसे करना है.
• हैशटैग #FileHandling का इस्तेमाल करके, @ChromiumDev को ट्वीट करें और हमें बताएं कि इसका इस्तेमाल कहां और कैसे किया जा रहा है.

मदद के लिए लिंक

• सार्वजनिक तौर पर जानकारी देने की सुविधा
• फ़ाइल मैनेज करने वाले एपीआई का डेमो | फ़ाइल मैनेज करने वाले एपीआई का डेमो सोर्स
• Chromium ट्रैकिंग बग
• ChromeStatus.com पर मौजूद जानकारी
• Blink कॉम्पोनेंट: UI>Browser>WebAppInstalls>FileHandling
• टैग की समीक्षा
• Mozilla के स्टैंडर्ड के बारे में जानकारी

आभार

फ़ाइल मैनेज करने वाले एपीआई को एरिक विलिगर्स, जे हैरिस, और रेम्स खुरी ने बनाया था. इस लेख की समीक्षा, Joe Medley ने की है.