Cloud Functions ile dinamik içerik sunun ve mikro hizmetleri barındırın

Dinamik içeriğinizi oluşturup sunmak veya REST API'lerini mikro hizmetler olarak oluşturmak için Bulut İşlevlerini Firebase Hosting ile eşleştirin.

Firebase için Cloud Functions, HTTPS isteklerine yanıt olarak arka uç kodunu otomatik olarak çalıştırmanıza olanak tanır. Kodunuz Google'ın bulutunda depolanır ve yönetilen bir ortamda çalışır. Kendi sunucularınızı yönetmenize ve ölçeklendirmenize gerek yok.

Örneğin, Firebase Hosting ile entegre Bulut İşlevlerine yönelik kullanım senaryoları ve örnekleri için sunucusuz genel bakış sayfamızı ziyaret edin.

Bulut İşlevlerini Firebase Hosting'e Bağlayın

Bu bölümde, bir işlevi Firebase Hosting'e bağlamak için ayrıntılı bir örnek verilmektedir.

Dinamik içerik sunma performansını artırmak için isteğe bağlı olarak önbellek ayarlarınızı ayarlayabileceğinizi unutmayın.

1. Adım: Cloud Functions'ı ayarlayın

  1. Firebase CLI'nin en son sürümüne sahip olduğunuzdan ve Firebase Hosting'i başlattığınızdan emin olun.

    CLI'yi yükleme ve Barındırma'yı başlatma hakkında ayrıntılı talimatlar için Barındırma için Başlangıç ​​kılavuzuna bakın.

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

    • Cloud Functions'ı zaten ayarladıysanız 2. Adım: Bir HTTPS işlevi oluşturma ve test etme adımına geçebilirsiniz.

    • Cloud Functions'ı kurmadıysanız :

      1. Proje dizininizin kökünden aşağıdaki komutu çalıştırarak Cloud Functions'ı başlatın:

        firebase init functions

      2. İstendiğinde JavaScript'i seçin (bu ayrıntılı örnekte JS kullanılmaktadır).

      3. Yerel proje dizininizde (az önce çalıştırdığınız Firebase komutu tarafından oluşturulan) bir functions dizininiz olup olmadığını kontrol edin. Bu functions dizini, Bulut İşlevleri kodunun bulunduğu yerdir.

2. Adım: Barındırma siteniz için bir HTTPS işlevi oluşturun ve test edin

  1. Favori düzenleyicinizde /functions/index.js dosyasını açın.

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

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

    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. Firebase Local Emulator Suite'i kullanarak işlevlerinizi yerel olarak test edin.

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

      firebase emulators:start

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

HTTPS istekleri hakkında daha fazla bilgi edinmek için Bulut İşlevleri belgelerini ziyaret edin.

Bir sonraki adım, Firebase tarafından barındırılan siteniz için dinamik içerik oluşturabilmesi amacıyla bu HTTPS işlevine bir Firebase Barındırma URL'sinden nasıl erişeceğiniz konusunda size yol gösterir.

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

Yeniden yazma kurallarıyla , belirli kalıplarla eşleşen istekleri tek bir hedefe yönlendirebilirsiniz. Aşağıdaki adımlar, bigben işlevini yürütmek için Hosting sitenizdeki ../bigben yolundaki tüm istekleri nasıl yönlendireceğinizi gösterir.

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

  2. hosting bölümünün 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örleriyle tekrar test ederek yönlendirmenizin beklendiği gibi çalıştığını doğrulayın.

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

      firebase emulators:start

    2. Siteniz için CLI tarafından döndürülen yerel olarak barındırılan URL'yi ziyaret edin (genellikle localhost:5000 ), ancak URL'yi bigben ile şu şekilde ekleyin: http://localhost:5000/bigben

  4. Siteniz için işlevinizi ve işlevselliğini yineleyin. Bu yinelemeleri test etmek için Firebase emülatörlerini kullanın.

En iyi performansı elde etmek için aşağıdaki bölgelerden birini seçerek işlevlerinizi Hosting ile aynı yerde konumlandırın:

  • us-west1
  • us-central1
  • us-east1
  • europe-west1
  • asia-east1

Yeniden yazma kuralları hakkında daha fazla ayrıntı için Barındırma yapılandırma sayfasını ziyaret edin. Ayrıca çeşitli Barındırma yapılandırmalarına yönelik yanıtların öncelik sırası hakkında da bilgi edinebilirsiniz.

Dinamik içerik sunma performansını artırmak için isteğe bağlı olarak önbellek ayarlarınızı ayarlayabileceğinizi unutmayın.

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

İşleviniz öykünücüde istendiği gibi çalışmaya başladıktan sonra onu gerçek proje kaynaklarıyla dağıtmaya, test etmeye ve çalıştırmaya devam edebilirsiniz. Bu, üretimde çalışan işlevler için ölçeklendirme davranışını denetlemek üzere çalışma zamanı seçeneklerini ayarlamayı düşünmek için iyi bir zamandır.

  1. Yerel proje dizininizin kökünden aşağıdaki komutu çalıştırarak işlevinizin yanı sıra Barındırma içeriğinizi de dağıtın ve sitenize yapılandırın:

    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

Bir web çerçevesi kullanın

Uygulamanızın dinamik içeriğini sunmak ve karmaşık web uygulamalarını daha kolay yazmak için Cloud Functions'ta Express.js gibi web çerçevelerini kullanabilirsiniz.

Aşağıdaki bölümde Express.js'yi Firebase Hosting ve Cloud Functions ile kullanmaya yönelik bir örnek verilmektedir.

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

    npm install express --save

  2. /functions/index.js dosyanızı açın, ardından Express.js'yi içe aktarın ve 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 / konumuna sunacak 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. Ve /api altında BONG sayısını JSON formatında bir API olarak döndürmek için başka bir uç nokta:

      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, Express.js'nin yapılandırdığımız farklı alt yola (bu örnekte / ve /api ) hizmet vermesine olanak tanır.

    {
 "hosting": {
   // ...

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

Ara yazılım ekle

Örneğimize devam edersek, artık Express.js'yi kullandığınıza göre, Express.js ara yazılımını normal şekilde ekleyebilirsiniz. Örneğin uç noktalarımızda CORS isteklerini etkinleştirebilirsiniz.

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

    npm install --save cors

  2. /functions/index.js dosyanızı açın, ardından Express.js uygulamanıza şu şekilde cors ekleyin:

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

Firebase'i Express uygulamaları ve ara katman yazılımı modülleriyle kullanma hakkında daha fazla bilgi edinmek için Bulut İşlevleri belgelerini ziyaret edin.

Sonraki adımlar