Cloud Functions ile dinamik içerik sunma ve mikro hizmetler sunma

Cloud Functions ile Firebase Hosting'i birlikte kullanarak veya REST API'lerini mikro hizmet olarak oluşturun.

Cloud Functions for Firebase, arka ucu otomatik olarak çalıştırmanızı sağlar HTTPS isteklerine yanıt olarak kodlayın. Kodunuz Google'ın bulutunda saklanır ve yönetilen bir ortamda çalışır. Kendi reklamlarınızı yönetmeniz ve ölçeklendirmeniz sunucular.

Örnek: Cloud Functions ile entegre kullanım alanları ve Firebase Hosting hakkında bilgi için sunucusuz genel bakış.

Cloud Functions'ı Firebase Hosting'e bağlama

Bu bölümde, bir fonksiyonu Firebase Barındırma.

Dinamik içerik sunma performansını iyileştirmek için şunları yapabilirsiniz: İsterseniz önbellek ayarlarınızı düzenleyebilirsiniz.

1. Adım: Cloud Functions'ı kurun

  1. Firebase CLI'ın en son sürümüne sahip olduğunuzdan ve Firebase Hosting'i başlatın.

    KSA'yı yükleme ve başlatma hakkında ayrıntılı talimatlar için Barındırma bilgileri Barındırma Başlangıç Kılavuzu.

  2. Cloud Functions'ı kurduğunuzdan emin olun:

    • Cloud Functions'ı önceden kurduysanız 2. Adım: HTTPS işlevi oluşturun ve test edin.

    • Cloud Functions'ı kurmadıysanız:

      1. Şu komutu çalıştırarak Cloud Functions'ı başlatın: proje dizininizin kökü:

        firebase init functions

      2. İstendiğinde JavaScript'i seçin (bu adım adım açıklamalı örnekte JS kullanılır).

      3. Yerel projenizde functions dizininiz olduğundan emin olun dizini (az önce çalıştırdığınız Firebase komutu tarafından oluşturulur). Bu functions dizini, Cloud Functions kodunun bulunduğu yerdir.

2. adım: Hosting siteniz için HTTPS işlevi oluşturun ve test edin

  1. /functions/index.js uygulamasını favori düzenleyicinizde açın.

  2. Dosyanın içeriğini aşağıdaki kodla değiştirin.

    Bu kod, HTTPS'ye yanıt veren bir HTTPS işlevi (bigben adında) oluşturur istekleri, tıpkı bir saat gibi günün her saati için BONG ile belirtilir.

    const functions = require('firebase-functions');

exports.bigben = functions.https.onRequest((req, res) => {
  const hours = (new Date().getHours() % 12) + 1  // London is UTC + 1hr;
  res.status(200).send(`<!doctype html>
    <head>
      <title>Time</title>
    </head>
    <body>
      ${'BONG '.repeat(hours)}
    </body>
  </html>`);
});

  3. Şunu kullanarak işlevlerinizi yerel olarak test edin: Firebase Local Emulator Suite.

    1. Yerel proje dizininizin kök dizininden aşağıdaki komutu çalıştırın komut:

      firebase emulators:start

    2. İşleve, CLI tarafından döndürülen yerel URL aracılığıyla erişin: örnek: http://localhost:5001/PROJECT_ID/us-central1/bigben

Cloud Functions belgelerini inceleyin bölümünü ziyaret edin.

Sonraki adımda bu HTTPS işlevine bir sunucudan Firebase Barındırma URL'si Firebase tarafından barındırılan site.

3. Adım: HTTPS isteklerini işlevinize yönlendirin

Entegre yeniden yazma kurallarını kullanıyorsanız istekleri belirli kalıplar tek bir hedefle eşleştiren Aşağıdaki adımlarda Hosting üzerinde ../bigben yolundan tüm istekleri nasıl yönlendireceğinizi öğrenin bigben işlevini çalıştırmak için kullanılır.

  1. firebase.json dosyanızı açın.

  2. hosting bölümü altına aşağıdaki rewrite yapılandırmasını ekleyin:

    "hosting": {
  // ...

  // Add the "rewrites" attribute within "hosting"
  "rewrites": [ {
    "source": "/bigben",
    "function": {
      "functionId": "bigben",
      "region": "us-central1"  // optional (see note below)
      "pinTag": true           // optional (see note below)
    }
  } ]
}

  3. Firebase emülatörleri.

    1. Yerel proje dizininizin kök dizininden aşağıdaki komutu çalıştırın komut:

      firebase emulators:start

    2. KSA tarafından döndürülen, sitenizin yerel olarak barındırılan URL'sini ziyaret edin (genellikle localhost:5000), ancak URL'yi bigben ile ekleyin. Örneğin: http://localhost:5000/bigben

  4. İşlevinizi ve sitenizdeki işlevselliği tekrarlayın. Şunu kullanın: Firebase emülatörleri kullanarak bu yinelemeleri test edebilirsiniz.

En iyi performans için işlevlerinizi Hosting ile birlikte kullanın: şu bölgelerden birini seçin:

  • us-west1
  • us-central1
  • us-east1
  • europe-west1
  • asia-east1
ziyaret edin.

Hosting yapılandırma sayfasını ziyaret edin: yeniden yazma kuralları hakkında daha fazla bilgi edinin. Şunları yapabilirsiniz: şu konularda da bilgi edinebilirsiniz: yanıtların öncelik sırası barındırmaktadır.

Dinamik içerik sunma performansını iyileştirmek için şunları yapabilirsiniz: İsterseniz önbellek ayarlarınızı düzenleyebilirsiniz.

4. Adım: İşlevinizi dağıtın

İşleviniz emülatörde istediğiniz gibi çalıştığında gerçek proje kaynaklarıyla dağıtma, test etme ve çalıştırma işlemlerini gerçekleştirebilirsiniz. Bu, çalışma zamanı seçeneklerini ölçeklendirme davranışını kontrol etme emin olun.

  1. İşlevinizi, Hosting içeriğinizi ve yapılandırmanızı yerel projenizin kök düzeyinden aşağıdaki komutu çalıştırarak sitemizi ziyaret edin: dizin:

    firebase deploy --only functions,hosting

  2. Yayındaki sitenize ve işlevinize aşağıdaki URL'lerden erişin:

    • Firebase alt alan adlarınız:
      PROJECT_ID.web.app/bigben ve PROJECT_ID.firebaseapp.com/bigben

    • Bağlı tüm özel alanlar:
      CUSTOM_DOMAIN/bigben

ziyaret edin.

Web çerçevesi kullanın

Aşağıdaki gibi web çerçevelerini kullanabilirsiniz: Ekspres.js'yi kullanarak uygulamanızın dinamik içeriğini sunar ve karmaşık web uygulamalarını daha kolay yazar.

Aşağıdaki bölümde, Express.js'yi Firebase Hosting ve Cloud Functions.

  1. Aşağıdaki komutu çalıştırarak Express.js'yi yerel projenize yükleyin functions dizininizden:

    npm install express --save

  2. /functions/index.js dosyanızı açın, ardından Express.js'yi içe aktarıp başlatın:

    const functions = require('firebase-functions');
const express = require('express');
const app = express();

  3. Aşağıdaki iki uç noktayı ekleyin:

    1. Web sitemizin dizinini / adresinde sunmak için ilk uç noktayı ekleyin.

      app.get('/', (req, res) => {
  const date = new Date();
  const hours = (date.getHours() % 12) + 1;  // London is UTC + 1hr;
  res.send(`
    <!doctype html>
    <head>
      <title>Time</title>
      <link rel="stylesheet" href="/style.css">
      <script src="/script.js"></script>
    </head>
    <body>
      <p>In London, the clock strikes:
        <span id="bongs">${'BONG '.repeat(hours)}</span></p>
      <button onClick="refresh(this)">Refresh</button>
    </body>
  </html>`);
});

    2. BONG değerini döndürecek başka bir uç nokta da JSON'de API olarak kullanılır biçiminde, /api altında:

      app.get('/api', (req, res) => {
  const date = new Date();
  const hours = (date.getHours() % 12) + 1;  // London is UTC + 1hr;
  res.json({bongs: 'BONG '.repeat(hours)});
});

  4. Express.js uygulamasını HTTPS işlevi olarak dışa aktarın:

    exports.app = functions.https.onRequest(app);

  5. firebase.json dosyanızda, tüm istekleri app işlevine yönlendirin. Bu yeniden yazma işlemi, Express.js'nin oluşturduğumuz farklı alt yolu yapılandırıldı (bu örnekte / ve /api).

    {
 "hosting": {
   // ...

   // Add the "rewrites" attribute within "hosting"
   "rewrites": [ {
     "source": "**",
     "function": "app"
   } ]
 }
}
ziyaret edin.

Ara katman yazılımı ekleme

Örneğimizden devam edersek, artık Express.js kullandığınıza göre, Express.js ara katman yazılımı geri dönelim. Örneğin, CORS isteklerine yanıt verir.

  1. Aşağıdaki komutu çalıştırarak cors ara katman yazılımını yükleyin:

    npm install --save cors

  2. /functions/index.js dosyanızı açın, ardından Express.js uygulamanıza cors ekleyin, Örneğin:

    const cors = require('cors')({origin: true});
app.use(cors);

Cloud Functions belgelerini inceleyin bölümünü ziyaret edin.

Sonraki adımlar