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

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

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

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

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

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

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

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

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

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

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

ब्राउज़र के इस्तेमाल से जुड़ी सहायता

  • Chrome: 102.
  • Edge: 102.
  • Firefox: समर्थित नहीं.
  • Safari: यह सुविधा काम नहीं करती.

सोर्स

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

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

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" को चुनें. सोर्स कोड में, लागू करने की प्रोसेस के बारे में जानें.

macOS की Finder विंडो में Excalidraw फ़ाइल.
अपने ऑपरेटिंग सिस्टम के फ़ाइल एक्सप्लोरर में, किसी फ़ाइल पर दो बार क्लिक या राइट क्लिक करें.
किसी फ़ाइल पर दायां क्लिक करने पर दिखने वाला संदर्भ मेन्यू. इसमें, 'इसमें खोलें' विकल्प के तौर पर Excalidraw आइटम हाइलाइट किया गया है.
Excalidraw, .excalidraw फ़ाइलों के लिए डिफ़ॉल्ट फ़ाइल हैंडलर है.

सुरक्षा

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

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

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

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

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

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

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

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

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

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

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

पारदर्शिता

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

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

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

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

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

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

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

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

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

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

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

मददगार लिंक

धन्यवाद

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