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

Cloud Functions oluşturmak ve yayınlamak için Firebase Hosting ile eşleştirin 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.

Örneğin, Cloud Functions için kullanım alanları ve örnekler, Firebase Hosting için sunucusuz genel bakış.

Cloud Functions ile Firebase Hosting arasında bağlantı kurun

Bu bölümde, bir fonksiyonu Firebase Hosting

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

1. Adım: Cloud Functions ayarlarını yapın

  1. Firebase KSA'nın en son sürümüne sahip olduğunuzdan ve Firebase Hosting uygulamasını başlattınız.

    KSA'yı yükleme ve başlatma hakkında ayrıntılı talimatlar için Hosting için Hosting için başlangıç kılavuzu.

  2. Cloud Functions uygulamasını kurduğunuzdan emin olun:

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

    • Cloud Functions hizmetini kurmadıysanız:

      1. Şu komutu çalıştırarak Cloud Functions hizmetini 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 bir 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 siteniz için dinamik içerik oluşturabilmesi amacıyla Firebase Hosting URL 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 cihazınızda ../bigben yolundan gelen tüm istekleri nasıl yönlendireceğinizi öğrenin sitesinde bigben işlevini yürütü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 yerleştirin: ş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ı çeşitli Hosting yapılandırmaları için.

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, Cloud Functions dilinde 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