Skip to main content

Documentation Index

Fetch the complete documentation index at: https://docs.mellowtel.com/llms.txt

Use this file to discover all available pages before exploring further.

यहां आप देखेंगे कि अपने Chrome/Edge एक्सटेंशन प्रोजेक्ट में Mellowtel लाइब्रेरी को कैसे इंप्लीमेंट करें। पूरा करने का अनुमानित समय: 5-7 मिनट।

ब्राउज़र नीतियों के साथ अनुपालन

यदि इंटीग्रेशन उपयोगकर्ताओं की पसंद और सेटिंग्स का सम्मान करता है, तो Mellowtel ब्राउज़र नीतियों के साथ अनुपालन करता है। आधिकारिक Mellowtel प्लगइन्स Chrome और Edge पर उपलब्ध हैं। जल्द ही हम इन्हें अन्य प्रमुख ब्राउज़रों पर भी सबमिट करेंगे। Chrome: https://chromewebstore.google.com/detail/support-with-mellowtel/jngbedjpioeongcicaomeideeompcbcc Edge: https://microsoftedge.microsoft.com/addons/detail/support-with-mellowtel/chpomjnojnimgcaomhmcmfgjinfoekhi Chrome पर, कुछ डेवलपर्स को सिंगल पर्पस पॉलिसी के साथ समीक्षा के दौरान समस्याएं हो सकती हैं, जो कहती है कि एक प्लगइन के पास केवल एक स्पष्ट रूप से बताई गई कार्यक्षमता होनी चाहिए (लेकिन अक्सर इसे मल्टी-फीचर एक्सटेंशनों में असंगत रूप से व्याख्या किया जाता है)। ऐसे मामलों में, हम डेवलपर्स को सलाह देते हैं कि वे अपनी व्यक्तिगत लिंक साझा करें और उपयोगकर्ताओं से आधिकारिक Mellowtel Chrome प्लगइन इंस्टॉल करने के लिए कहें, जिसका एकमात्र उद्देश्य डेवलपर्स को उन उपयोगकर्ताओं के माध्यम से समर्थन करना है जो अपनी निष्क्रिय संसाधनों को साझा करके उन्हें समर्थन देना चाहते हैं। डेवलपर्स अपने लिंक को Mellowtel डैशबोर्ड से बना सकते हैं और उपयोगकर्ताओं को आधिकारिक Mellowtel Chrome प्लगइन पर रीडायरेक्ट कर सकते हैं। यदि, इसके बजाय, आपके पास Chrome पर एक प्लगइन है जो AI बैंडविड्थ शेयरिंग स्पेस में काम करता है और यह प्लगइन का एकमात्र उद्देश्य है, तो आप अपने प्लगइन में सीधे Mellowtel को इंटीग्रेट कर सकते हैं। इसके बजाय, Edge, Firefox, या Safari में यह नीति नहीं है, इसलिए डेवलपर्स लाइब्रेरी को सीधे अपने उत्पादों में इंटीग्रेट कर सकते हैं और सुनिश्चित कर सकते हैं कि वे अपने उपयोगकर्ताओं से पूछें कि वे उन्हें समर्थन देना चाहते हैं या नहीं और हमेशा उन्हें प्लगइन से ही अपनी सेटिंग्स को किसी भी समय बदलने का एक आसान तरीका छोड़ दें।

अनुशंसित ब्राउज़र

वर्तमान समय में, हम Edge प्लगइन्स में Mellowtel को इंटीग्रेट करने की सलाह देते हैं क्योंकि हम अभी भी लाइब्रेरी के Firefox और Safari संस्करणों को ऑप्टिमाइज़ करने पर काम कर रहे हैं।

आवश्यकताएँ

शुरू करने से पहले, सुनिश्चित करें कि:
  1. आपका प्लगइन Manifest V3 का उपयोग कर रहा है।
  2. आपका कोड Webpack, Rollup, या अन्य बंडलर्स का उपयोग करके एक संकलित तरीके से संगठित है। यदि आपके पास बंडलर सेटअप नहीं है, तो पहले यहां गाइड का पालन करें

npm पैकेज इंस्टॉल करें

npm पैकेज को इंस्टॉल करने के लिए, आप अपने टर्मिनल में निम्नलिखित कमांड चला सकते हैं:
npm install mellowtel
यदि आप अपने पैकेज मैनेजर के रूप में yarn का उपयोग कर रहे हैं, तो आप निम्नलिखित कमांड चला सकते हैं:
yarn add mellowtel

इंप्लीमेंटेशन का निर्णय लें

आप अपने एक्सटेंशन में लाइब्रेरी को दो तरीकों से इंप्लीमेंट कर सकते हैं। यदि आप पहली बार वेब स्टोर पर एक्सटेंशन जारी करने जा रहे हैं तो विकल्प 1 का पालन करें। यदि आपने पहले से ही वेब स्टोर पर एक्सटेंशन प्रकाशित कर दिया है तो “कैसे निर्णय लें?” पढ़ें

कैसे निर्णय लें?

जब आप वेब स्टोर से अपना एक्सटेंशन इंस्टॉल करते हैं, तो क्या कोई अलर्ट विंडो पॉप अप होती है जो सभी वेबसाइटों पर आपके डेटा को “पढ़ने और बदलने” की अनुमति मांगती है? यह इस तरह दिखता है:
यदि ऐसा होता है, तो आप विकल्प 1 का पालन कर सकते हैं। यदि ऐसा नहीं होता है, तो आपको विकल्प 2 का पालन करना होगा।

विकल्प 1

यदि आप पहली बार वेब स्टोर पर एक्सटेंशन जारी कर रहे हैं या आप लाइब्रेरी को एक एक्सटेंशन में इंपोर्ट कर रहे हैं जो सभी वेबसाइटों पर काम करने की अनुमति मांगता है, तो आप विकल्प 1 का पालन कर सकते हैं।

अपने मैनिफेस्ट को सेट करें

अपने manifest.json फ़ाइल में permissions और host_permissions सेक्शन को इस तरह से संशोधित करें:
{

  "permissions": [
    "storage",
    "declarativeNetRequest"
  ],
  "host_permissions": [
    "\u003Call_urls\u003E"
  ]

}

अपने सर्विस वर्कर (बैकग्राउंड स्क्रिप्ट) को सेट करें

अपने सर्विस वर्कर फ़ाइल में, आपको mellowtel पैकेज को इंपोर्ट करने की आवश्यकता है। नोट: सर्विस वर्कर को बैकग्राउंड स्क्रिप्ट के रूप में भी जाना जाता है। आप अपने सर्विस वर्कर फ़ाइल में निम्नलिखित कोड को कॉपी और पेस्ट कर सकते हैं, अपने configuration_key को अपने स्वयं के कुंजी के साथ बदलें।
import Mellowtel from "mellowtel";

let mellowtel;

(async () => {
    mellowtel = new Mellowtel("<configuration_key>"); // अपने कॉन्फ़िगरेशन कुंजी के साथ बदलें
    await mellowtel.initBackground();
})();
mellowtel पैकेज को इंपोर्ट करें
    import Mellowtel from "mellowtel";
आप Mellowtel(configuration_key, options?) का उपयोग करके Mellowtel ऑब्जेक्ट का एक नया इंस्टेंस बना सकते हैं। Mellowtel ऑब्जेक्ट Mellowtel के SDK के बाकी हिस्सों के लिए आपका एंट्रीपॉइंट है। इस फ़ंक्शन को कॉल करते समय आपका configuration_key आवश्यक है, क्योंकि यह आपके एक्सटेंशन को Mellowtel से पहचानता है। आप अपना configuration_key डैशबोर्ड में पा सकते हैं
mellowtel = new Mellowtel("<configuration_key>");
initBackground मेथड को कॉल करके Mellowtel को प्रारंभ करें। यह मेथड Mellowtel ऑब्जेक्ट को प्रारंभ करेगा और आवश्यक लिसनर्स को सेट करेगा।
await mellowtel.initBackground();

अपने कंटेंट स्क्रिप्ट को सेट करें

आपको कंटेंट स्क्रिप्ट्स में भी mellowtel पैकेज को इंपोर्ट करना होगा। यह कंटेंट स्क्रिप्ट all_frames और <all_urls> में document_start पर चलनी चाहिए। हम सुझाव देते हैं कि एक नई कंटेंट स्क्रिप्ट (जैसे content_start_mellowtel.js) बनाएं जहां आप निम्नलिखित कोड को कॉपी और पेस्ट कर सकते हैं। अपने configuration_key को अपने स्वयं के कुंजी के साथ बदलें।
import Mellowtel from "mellowtel";

(async () => {
    const mellowtel = new Mellowtel("<configuration_key>"); // अपने कॉन्फ़िगरेशन कुंजी के साथ बदलें
    await mellowtel.initContentScript();
})();
फिर याद रखें कि इस कंटेंट स्क्रिप्ट को अपने manifest.json फ़ाइल में कंटेंट स्क्रिप्ट्स सेक्शन में जोड़ें, साथ ही किसी भी अन्य कंटेंट स्क्रिप्ट के साथ जो आपके पास पहले से है। आप निम्नलिखित कोड को कॉपी और पेस्ट कर सकते हैं, name_of_your_content_script.js को आपके द्वारा चुने गए नाम के साथ बदलें।
{
  "content_scripts": [
    {
      "matches": ["<all_urls>"],
      "js": ["<name_of_your_content_script.js>"], // <-- यहां अपने कंटेंट स्क्रिप्ट के नाम के साथ बदलें
      "run_at": "document_start",
      "all_frames": true
    }
  ]
}

ऑप्ट-इन/ऑप्ट-आउट लॉजिक सेट करें

Mellowtel को सक्रिय करने के लिए, उपयोगकर्ताओं को सेवा के लिए स्पष्ट रूप से ऑप्ट-इन करना होगा। आप ऑप्ट-इन/ऑप्ट-आउट लॉजिक को दो तरीकों से इंप्लीमेंट कर सकते हैं:
  1. Mellowtel द्वारा प्रदान किए गए प्री-बिल्ट पेज के साथ अनुशंसित इंप्लीमेंटेशन का उपयोग करना।
  2. अपने स्वयं के कस्टम ऑप्ट-इन/ऑप्ट-आउट एलिमेंट्स बनाना और यहां दिखाए गए मेथड्स का उपयोग करना
यदि अपने स्वयं के ऑप्ट-इन/ऑप्ट-आउट एलिमेंट्स बनाने का चयन करते हैं, तो Mellowtel Elements का उपयोग करने पर विचार करें - प्री-बिल्ट UI कंपोनेंट्स जो उपयोगकर्ता की सहमति और सेटिंग्स को न्यूनतम इंटीग्रेशन प्रयास के साथ संभालते हैं।
यदि आप अनुशंसित इंप्लीमेंटेशन का उपयोग करते हैं, तो अपने सर्विस वर्कर फ़ाइल (जिसे बैकग्राउंड स्क्रिप्ट भी कहा जाता है) को खोलें और निम्नलिखित कोड जोड़ें:
chrome.runtime.onInstalled.addListener(async function(details) {
    console.log("एक्सटेंशन इंस्टॉल या अपडेट हुआ");
    // यदि आप पहली इंस्टॉल और अपडेट को अलग-अलग तरीके से संभालना चाहते हैं
    /**
    if(details.reason === "install"){
        // पहली इंस्टॉल को संभालने के लिए एक फ़ंक्शन कॉल करें
    } else if(details.reason === "update") {
        // अपडेट को संभालने के लिए एक फ़ंक्शन कॉल करें
    }
    **/
    await mellowtel.generateAndOpenOptInLink();
});

सेटिंग्स लिंक जनरेट करें

अपने उपयोगकर्ताओं को उनके बैंडविड्थ पर पूर्ण नियंत्रण देने के लिए, यह आवश्यक है कि आप उन्हें किसी भी समय अपनी सेटिंग्स बदलने के लिए एक आसानी से सुलभ तरीका छोड़ दें। आप generateSettingsLink() मेथड का उपयोग करके एक लिंक जनरेट कर सकते हैं। यह मेथड एक लिंक लौटाएगा जो Mellowtel सेटिंग्स पेज को खोलेगा जहां उपयोगकर्ता किसी भी समय यह तय कर सकते हैं कि वे ऑप्ट-इन करना चाहते हैं या ऑप्ट-आउट। यह लिंक पॉपअप, विकल्प पेज या किसी भी अन्य स्थान पर रखा जाना चाहिए जहां उपयोगकर्ता इसे आसानी से एक्सेस कर सकें। उदाहरण के लिए, आप इसे openSettings() फ़ंक्शन में इस तरह रख सकते हैं। आप openSettings() को बटन क्लिक या किसी अन्य प्रासंगिक इवेंट पर कॉल कर सकते हैं:
async function openSettings() {
    try {
        // सेटिंग्स लिंक जनरेट करें और प्रबंधित करें
        const settingsLink = await mellowtel.generateSettingsLink();
        // डिबगिंग के लिए जनरेटेड लिंक लॉग करें
        console.log("जनरेटेड सेटिंग्स लिंक:", settingsLink);
        // अब आप इस लिंक का उपयोग पॉपअप, विकल्प पेज, या किसी UI एलिमेंट में कर सकते हैं
    } catch (error) {
        console.error("सेटिंग्स लिंक जनरेट करने में त्रुटि:", error);
    }
}
बिल्कुल सही! अब आप अपने एक्सटेंशन को वेब स्टोर पर भेजने के लिए तैयार हैं। देखें कि कैसे अपने एक्सटेंशन को सबमिट करें

विकल्प 2

विकल्प 2 यदि सही तरीके से इंप्लीमेंट नहीं किया गया तो आपके एक्सटेंशन को निष्क्रिय कर सकता है। इसलिए यह सभी उपयोगकर्ताओं के लिए उपलब्ध नहीं है
यदि आप विकल्प 1 को इंप्लीमेंट नहीं कर सकते हैं, तो कृपया हमसे Discord पर संपर्क करें।