Google Kitaplar'daki bağlantıları akıllı çiplerle önizleme

Kodlama seviyesi: Orta
Süre: 30 dakika
Proje türü: Google Workspace eklentisi

Hedefler

• Eklentinin ne yaptığını anlayın.
• Apps Komut Dosyası'nı kullanarak nasıl eklenti oluşturacağınızı ve Apps Komut Dosyası hizmetlerinin ne yaptığını öğrenin.
• Ortamınızı ayarlayın.
• Komut dosyasını ayarlayın.
• Komut dosyasını çalıştırın.

Bu Google Workspace eklentisi hakkında

Bu örnekte, Google Kitaplar'daki bağlantıları Google Dokümanlar dokümanında önizleyen bir Google Workspace eklentisi oluşturursunuz. Bir Google Kitaplar URL'sini bir dokümana yazdığınızda veya yapıştırdığınızda eklenti bağlantıyı tanır ve bağlantı önizlemesini tetikler. Bağlantıyı önizlemek için bağlantıyı akıllı çipe dönüştürebilir ve işaretçiyi bağlantının üzerine getirerek kitap hakkında daha fazla bilgi içeren bir kart görüntüleyebilirsiniz.

Bu eklenti, Google Kitaplar API'sine bağlanmak ve Google Dokümanlar'da gösterilecek Google Kitaplar bilgileri almak için Apps Komut Dosyası'nın UrlFetch Hizmeti'ni kullanır.

İşleyiş şekli

Google Workspace eklentisinin manifest dosyasında komut dosyası, eklentiyi Google Dokümanlar'ı genişletecek ve Google Kitaplar web sitesindeki belirli kalıplarla eşleşen URL'ler için bağlantı önizlemelerini tetikleyecek şekilde yapılandırır (https://books.google.com).

Kod dosyasında komut dosyası, Google Kitaplar API'ye bağlanır ve kitapla ilgili bilgi almak için URL'yi kullanır (bu URL, Volume kaynağının bir örneğidir). Komut dosyası, kitabın başlığını gösteren bir akıllı çip ve özeti, sayfa sayısını, kitap kapağının resmini ve derecelendirme sayısını gösteren bir önizleme kartı oluşturmak için bu bilgileri kullanır.

Apps Komut Dosyası hizmetleri

Bu eklenti aşağıdaki hizmetleri kullanır:

• UrlFetch Hizmeti: Kitaplar (API'lerin Volume kaynağı örnekleridir) hakkında bilgi almak için Google Books API'ye bağlanır.
• Card Service: Eklentinin kullanıcı arayüzünü oluşturur.

Ön koşullar

Bu örneği kullanmak için aşağıdaki ön koşullara ihtiyacınız vardır:

• Google Hesabı (Google Workspace hesapları için yönetici onayı gerekebilir).

• İnternete erişimi olan bir web tarayıcısı.

• İlişkili bir faturalandırma hesabı olan bir Google Cloud projesi. Proje için faturalandırmayı etkinleştirme başlıklı makaleyi inceleyin.

Ortamınızı ayarlama

Aşağıdaki bölümlerde, eklentiyi oluşturmak için ortamınızı ayarlayabilirsiniz.

Cloud projenizi Google Cloud Console'da açma

Henüz açık değilse bu örnek için kullanmayı planladığınız Cloud projesini açın:

1. Google Cloud Console'da Proje seçin sayfasına gidin.

   Bulut projesi seçin

2. Kullanmak istediğiniz Google Cloud projesini seçin. Alternatif olarak Proje oluştur'u tıklayıp ekrandaki talimatları uygulayın. Google Cloud projesi oluşturursanız proje için faturalandırmayı etkinleştirmeniz gerekebilir.

Google Books API'yi etkinleştirme

Bu eklenti, Google Books API'ye bağlanır. Google API'lerini kullanmadan önce bir Google Cloud projesinde etkinleştirmeniz gerekir. Tek bir Google Cloud projesinde bir veya daha fazla API'yi etkinleştirebilirsiniz.

• Cloud projenizde Kitaplar API'yi etkinleştirin.

  API'yi etkinleştirme

OAuth izin ekranını yapılandırma

Bu eklenti için yapılandırılmış bir izin ekranı içeren bir Cloud projesi gerekir. OAuth kullanıcı rızası ekranını yapılandırarak Google'ın kullanıcılara ne göstereceğini tanımlar ve uygulamanızı daha sonra yayınlayabilmeniz için kaydedersiniz.

1. Google Cloud Console'da Menü > API'ler ve Hizmetler > OAuth izin ekranı'na gidin.

   OAuth izin ekranına gidin

2. Kullanıcı türü için Dahili'yi seçin ve Oluştur'u tıklayın.
3. Uygulama kayıt formunu doldurup Kaydet ve Devam Et'i tıklayın.

4. Şimdilik kapsam eklemeyi atlayabilir ve Kaydet ve Devam Et'i tıklayabilirsiniz. Gelecekte, Google Workspace kuruluşunuzun dışında kullanılacak bir uygulama oluşturduğunuzda Kullanıcı türü'nü Harici olarak değiştirmeniz ve ardından uygulamanızın gerektirdiği yetkilendirme kapsamlarını eklemeniz gerekir.

5. Uygulama kaydı özetinizi inceleyin. Değişiklik yapmak için Düzenle'yi tıklayın. Uygulama kaydının sorunsuz görünmesi durumunda Kontrol paneline dön'ü tıklayın.

Google Books API için API anahtarı alma

1. Google Cloud Console'a gidin. Faturalandırma özelliği etkinleştirilmiş projenizin açık olduğundan emin olun.

2. Google Cloud Console'da Menü > API'ler ve Hizmetler > Kimlik bilgileri'ne gidin.

   Kimlik Bilgileri'ne gidin

3. Kimlik bilgileri oluştur > API anahtarı'nı tıklayın.

4. Sonraki bir adımda kullanmak üzere API anahtarınızı not edin.

Komut dosyasını ayarlama

Aşağıdaki bölümlerde, eklentiyi oluşturmak için komut dosyası ayarlanır.

Apps Komut Dosyası projesini oluşturma

1. Google Kitaplar'daki bağlantıları önizleme Apps Komut Dosyası projesini açmak için aşağıdaki düğmeyi tıklayın.
   Projeyi açma
2. Genel Bakış'ı tıklayın.
3. Genel bakış sayfasında Kopya oluştur'u tıklayın.
4. Apps Komut Dosyası projenizin kopyasında Code.gs dosyasına gidin ve YOUR_API_KEY değerini önceki bölümde oluşturduğunuz API anahtarıyla değiştirin.

Cloud proje numarasını kopyalama

1. Google Cloud Console'da Menü > IAM ve Yönetici > Ayarlar'a gidin.

   IAM ve Yönetici Ayarları'na gidin

2. Proje numarası alanındaki değeri kopyalayın.

Apps Komut Dosyası projesinin Cloud projesini ayarlama

1. Apps Komut Dosyası projenizde Proje Ayarları'nı tıklayın.
2. Google Cloud Platform (GCP) Projesi bölümünde Projeyi değiştir'i tıklayın.
3. GCP proje numarası alanına Google Cloud proje numarasını yapıştırın.
4. Proje ayarla'yı tıklayın.

Eklentiyi test etme

Aşağıdaki bölümlerde, oluşturduğunuz eklenti test edilir.

Test dağıtımı yükleme

1. Apps Komut Dosyası projenizde Düzenleyici'yi tıklayın.
2. YOUR_API_KEY değerini, önceki bir bölümde oluşturulan Google Kitaplar API'sinin API anahtarıyla değiştirin.
3. Dağıt > Dağıtım testleri'ni tıklayın.
4. Yükle > Bitti'yi tıklayın.

Google Dokümanlar'da bağlantı önizleme

1. docs.new adresinde bir Google Dokümanlar dokümanı oluşturun.
2. Aşağıdaki URL'yi belgeye yapıştırın ve URL'yi akıllı çipe dönüştürmek için sekme tuşuna basın: https://www.google.com/books/edition/Software_Engineering_at_Google/V3TTDwAAQBAJ
3. İşaretçiyi akıllı çipin üzerine getirin ve istendiğinde eklentiyi çalıştırmak için erişimi yetkilendirin. Önizleme kartında kitapla ilgili bilgiler gösterilir.

Aşağıdaki resimde bağlantı önizlemesi gösterilmektedir:

Kodu inceleme

Bu eklentinin Apps Komut Dosyası kodunu incelemek için Kaynak kodunu görüntüle'yi tıklayarak bölümü genişletin:

Kaynak kodu göster

appsscript.json

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

GitHub'da göster

{
  "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'da göster

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();
  }
}

İlgili konular

• Akıllı çiplerle bağlantıları önizleme
• Google Kitaplar API referans dokümanları