स्मार्ट चिप की मदद से, Google Books पर मौजूद लिंक की झलक देखना

कोडिंग लेवल: इंटरमीडिएट
अवधि: 30 मिनट
प्रोजेक्ट टाइप: Google Workspace ऐड-ऑन

मकसद

• जानें कि ऐड-ऑन क्या करता है.
• Apps Script का इस्तेमाल करके ऐड-ऑन बनाने का तरीका जानें. साथ ही, यह भी जानें कि Apps Script की सेवाएं क्या करती हैं.
• अपना एनवायरमेंट सेट अप करें.
• स्क्रिप्ट सेट अप करें.
• स्क्रिप्ट चलाएं.

Google Workspace के इस ऐड-ऑन के बारे में जानकारी

इस सैंपल में, आपने Google Workspace का एक ऐड-ऑन बनाया है. यह ऐड-ऑन, Google Docs दस्तावेज़ में Google Books के लिंक की झलक दिखाता है. जब किसी दस्तावेज़ में Google Books का यूआरएल टाइप या चिपकाया जाता है, तो ऐड-ऑन उस लिंक को पहचानता है और लिंक की झलक दिखाता है. लिंक की झलक देखने के लिए, लिंक को स्मार्ट चिप में बदला जा सकता है. इसके बाद, लिंक पर कर्सर घुमाकर, उस कार्ड को देखा जा सकता है जिसमें किताब के बारे में ज़्यादा जानकारी होती है.

यह ऐड-ऑन, Google Books API से कनेक्ट करने और Google Docs में दिखाने के लिए, Google Books के बारे में जानकारी पाने के लिए, Apps Script की UrlFetch सेवा का इस्तेमाल करता है.

यह कैसे काम करता है

Google Workspace ऐड-ऑन की मेनिफ़ेस्ट फ़ाइल में, स्क्रिप्ट, ऐड-ऑन को कॉन्फ़िगर करती है, ताकि Google Docs का इस्तेमाल किया जा सके. साथ ही, यह Google Books की वेबसाइट (https://books.google.com) के कुछ पैटर्न से मैच करने वाले यूआरएल के लिए, लिंक की झलक को ट्रिगर करती है.

कोड फ़ाइल में, स्क्रिप्ट Google Books API से कनेक्ट होती है और किताब के बारे में जानकारी पाने के लिए यूआरएल का इस्तेमाल करती है. यह जानकारी, Volume रिसॉर्स का एक इंस्टेंस है. स्क्रिप्ट इस जानकारी का इस्तेमाल करके, एक स्मार्ट चिप जनरेट करती है. यह चिप, किताब का टाइटल और झलक दिखाने वाला कार्ड दिखाती है. इस कार्ड में, किताब की खास जानकारी, पेजों की संख्या, किताब के कवर की इमेज, और रेटिंग की संख्या दिखती है.

Apps Script की सेवाएं

यह ऐड-ऑन इन सेवाओं का इस्तेमाल करता है:

• UrlFetch सेवा–किताबों के बारे में जानकारी पाने के लिए, Google Books API से कनेक्ट होती है. ये किताबें, एपीआई Volume संसाधन के इंस्टेंस होती हैं.
• कार्ड सेवा– यह ऐड-ऑन का यूज़र इंटरफ़ेस बनाता है.

ज़रूरी शर्तें

इस सैंपल का इस्तेमाल करने के लिए, आपको ये ज़रूरी शर्तें पूरी करनी होंगी:

• Google खाता (Google Workspace खातों के लिए, एडमिन की अनुमति की ज़रूरत पड़ सकती है).

• इंटरनेट का ऐक्सेस वाला वेब ब्राउज़र.

• कोई Google Cloud प्रोजेक्ट, जिसमें कोई बिलिंग खाता जुड़ा हो. किसी प्रोजेक्ट के लिए बिलिंग की सुविधा चालू करना लेख पढ़ें.

अपना एनवायरमेंट सेट अप करने का तरीका

नीचे दिए गए सेक्शन में, ऐड-ऑन बनाने के लिए आपका एनवायरमेंट सेट अप किया गया है.

Google Cloud Console में अपना Cloud प्रोजेक्ट खोलें

अगर यह पहले से नहीं खुला है, तो वह Cloud प्रोजेक्ट खोलें जिसका इस्तेमाल आपको इस सैंपल के लिए करना है:

1. Google Cloud Console में, कोई प्रोजेक्ट चुनें पेज पर जाएं.

   कोई Cloud प्रोजेक्ट चुनना

2. वह Google Cloud प्रोजेक्ट चुनें जिसका इस्तेमाल करना है. इसके अलावा, प्रोजेक्ट बनाएं पर क्लिक करें और स्क्रीन पर दिए गए निर्देशों का पालन करें. Google Cloud प्रोजेक्ट बनाने पर, आपको उस प्रोजेक्ट के लिए बिलिंग चालू करनी पड़ सकती है.

Google Books API चालू करना

यह ऐड-ऑन, Google Books API से कनेक्ट होता है. Google API का इस्तेमाल करने से पहले, आपको उन्हें Google Cloud प्रोजेक्ट में चालू करना होगा. किसी एक Google Cloud प्रोजेक्ट में, एक या उससे ज़्यादा एपीआई चालू किए जा सकते हैं.

• अपने Cloud प्रोजेक्ट में, Books API चालू करें.

  एपीआई को चालू करना

OAuth की सहमति वाली स्क्रीन को कॉन्फ़िगर करना

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

1. Google Cloud Console में, मेन्यू > एपीआई और सेवाएं > OAuth की सहमति वाली स्क्रीन पर जाएं.

   OAuth की सहमति वाली स्क्रीन पर जाना

2. उपयोगकर्ता टाइप के लिए, इंटरनल चुनें. इसके बाद, बनाएं पर क्लिक करें.
3. ऐप्लिकेशन रजिस्ट्रेशन फ़ॉर्म को पूरा करें. इसके बाद, सेव करें और जारी रखें पर क्लिक करें.

4. फ़िलहाल, स्कोप जोड़ने की प्रोसेस को छोड़ा जा सकता है. इसके बाद, सेव करें और जारी रखें पर क्लिक करें. आने वाले समय में, जब आप अपने Google Workspace संगठन के बाहर इस्तेमाल करने के लिए कोई ऐप्लिकेशन बनाएं, तो आपको उपयोगकर्ता टाइप को बाहरी में बदलना होगा. इसके बाद, अपने ऐप्लिकेशन के लिए अनुमति के दायरे जोड़ें.

5. अपने ऐप्लिकेशन के रजिस्ट्रेशन की खास जानकारी देखें. बदलाव करने के लिए, बदलाव करें पर क्लिक करें. अगर ऐप्लिकेशन का रजिस्ट्रेशन ठीक है, तो डैशबोर्ड पर वापस जाएं पर क्लिक करें.

Google Books API के लिए एपीआई पासकोड पाना

1. Google Cloud Console पर जाएं. पक्का करें कि बिलिंग की सुविधा चालू किया गया आपका प्रोजेक्ट खुला हो.

2. Google Cloud console में, मेन्यू > एपीआई और सेवाएं > क्रेडेंशियल पर जाएं.

   क्रेडेंशियल पर जाएं

3. क्रेडेंशियल बनाएं > एपीआई कुंजी पर क्लिक करें.

4. आगे के चरण में इस्तेमाल करने के लिए, अपनी एपीआई पासकोड को नोट कर लें.

स्क्रिप्ट सेट अप करना

नीचे दिए गए सेक्शन में, ऐड-ऑन बनाने के लिए स्क्रिप्ट सेट अप करने का तरीका बताया गया है.

Apps Script प्रोजेक्ट बनाना

1. Google Books से लिंक की झलक दिखाने वाला Apps Script प्रोजेक्ट खोलने के लिए, नीचे दिए गए बटन पर क्लिक करें.
   प्रोजेक्ट खोलना
2. खास जानकारी पर क्लिक करें.
3. खास जानकारी वाले पेज पर, कॉपी बनाएं पर क्लिक करें.
4. Apps Script प्रोजेक्ट की कॉपी में, Code.gs फ़ाइल पर जाएं और YOUR_API_KEY को उस एपीआई कुंजी से बदलें जिसे आपने पिछले सेक्शन में जनरेट किया था.

Cloud प्रोजेक्ट का नंबर कॉपी करना

1. Google Cloud console में, मेन्यू > IAM और एडमिन > सेटिंग पर जाएं.

   आईएएम और एडमिन सेटिंग पर जाएं

2. प्रोजेक्ट नंबर फ़ील्ड में, वैल्यू कॉपी करें.

Apps Script प्रोजेक्ट का Cloud प्रोजेक्ट सेट करना

1. अपने Apps Script प्रोजेक्ट में, प्रोजेक्ट सेटिंग पर क्लिक करें.
2. Google Cloud Platform (GCP) प्रोजेक्ट में जाकर, प्रोजेक्ट बदलें पर क्लिक करें.
3. GCP प्रोजेक्ट नंबर में, Google Cloud प्रोजेक्ट नंबर चिपकाएं.
4. प्रोजेक्ट सेट करें पर क्लिक करें.

ऐड-ऑन की जांच करना

यहां दिए गए सेक्शन में, आपके बनाए गए ऐड-ऑन की जांच की जाती है.

टेस्ट डिप्लॉयमेंट इंस्टॉल करना

1. अपने Apps Script प्रोजेक्ट में, एडिटर पर क्लिक करें.
2. YOUR_API_KEY को, पिछले सेक्शन में बनाए गए Google Books API के एपीआई पासकोड से बदलें.
3. डिप्लॉय करें > डिप्लॉयमेंट की जांच करें पर क्लिक करें.
4. इंस्टॉल करें > हो गया पर क्लिक करें.

Google Docs में किसी लिंक की झलक देखना

1. docs.new पर जाकर, Google Docs दस्तावेज़ बनाएं.
2. दस्तावेज़ में यह यूआरएल चिपकाएं और यूआरएल को स्मार्ट चिप में बदलने के लिए, Tab बटन दबाएं: https://www.google.com/books/edition/Software_Engineering_at_Google/V3TTDwAAQBAJ
3. स्मार्ट चिप पर कर्सर को कुछ देर तक रखें. इसके बाद, ऐड-ऑन को चलाने के लिए, जब कहा जाए, तब ऐक्सेस की अनुमति दें. झलक दिखाने वाले कार्ड में, किताब के बारे में जानकारी दिखती है.

इस इमेज में, लिंक की झलक दिखाई गई है:

कोड की समीक्षा करना

इस ऐड-ऑन के लिए Apps Script कोड की समीक्षा करने के लिए, सेक्शन को बड़ा करने के लिए सोर्स कोड देखें पर क्लिक करें:

सोर्स कोड देखें

appsscript.json

solutions/add-on/book-smartchip/appsscript.json

GitHub पर देखना

{
  "timeZone": "America/Los_Angeles",
  "exceptionLogging": "STACKDRIVER",
  "runtimeVersion": "V8",
  "oauthScopes": [
    "https://www.googleapis.com/auth/workspace.linkpreview",
    "https://www.googleapis.com/auth/script.external_request"
  ],
  "urlFetchWhitelist": [
    "https://www.googleapis.com/books/v1/volumes/"
  ],
  "addOns": {
    "common": {
      "name": "Preview Books Add-on",
      "logoUrl": "https://developers.google.com/workspace/add-ons/images/library-icon.png",
      "layoutProperties": {
        "primaryColor": "#dd4b39"
      }
    },
    "docs": {
      "linkPreviewTriggers": [
        {
          "runFunction": "bookLinkPreview",
          "patterns": [
            {
              "hostPattern": "*.google.*",
              "pathPrefix": "books"
            },
            {
              "hostPattern": "*.google.*",
              "pathPrefix": "books/edition"
            }
          ],
          "labelText": "Book",
          "logoUrl": "https://developers.google.com/workspace/add-ons/images/book-icon.png",
          "localizedLabelText": {
            "es": "Libros"
          }
        }
      ]
    }
  }
}

Code.gs

solutions/add-on/book-smartchip/Code.js

GitHub पर देखना

function getBook(id) {
  const apiKey = 'YOUR_API_KEY'; // Replace with your API key
  const apiEndpoint = `https://www.googleapis.com/books/v1/volumes/${id}?key=${apiKey}&country=US`;
  const response = UrlFetchApp.fetch(apiEndpoint);
  return JSON.parse(response);
}

function bookLinkPreview(event) {
 if (event.docs.matchedUrl.url) {
    const segments = event.docs.matchedUrl.url.split('/');
    const volumeID = segments[segments.length - 1];

    const bookData = getBook(volumeID);
    const bookTitle = bookData.volumeInfo.title;
    const bookDescription = bookData.volumeInfo.description;
    const bookImage = bookData.volumeInfo.imageLinks.small;
    const bookAuthors = bookData.volumeInfo.authors;
    const bookPageCount = bookData.volumeInfo.pageCount;

    const previewHeader = CardService.newCardHeader()
      .setSubtitle('By ' + bookAuthors)
      .setTitle(bookTitle);

    const previewPages = CardService.newDecoratedText()
      .setTopLabel('Page count')
      .setText(bookPageCount);

    const previewDescription = CardService.newDecoratedText()
      .setTopLabel('About this book')
      .setText(bookDescription).setWrapText(true);

    const previewImage = CardService.newImage()
      .setAltText('Image of book cover')
      .setImageUrl(bookImage);

    const buttonBook = CardService.newTextButton()
      .setText('View book')
      .setOpenLink(CardService.newOpenLink()
        .setUrl(event.docs.matchedUrl.url));

    const cardSectionBook = CardService.newCardSection()
      .addWidget(previewImage)
      .addWidget(previewPages)
      .addWidget(CardService.newDivider())
      .addWidget(previewDescription)
      .addWidget(buttonBook);

    return CardService.newCardBuilder()
    .setHeader(previewHeader)
    .addSection(cardSectionBook)
    .build();
  }
}

मिलते-जुलते विषय

• स्मार्ट चिप की मदद से लिंक की झलक देखना
• Google Books API का रेफ़रंस दस्तावेज़