Phân phối nội dung động và dịch vụ vi mô lưu trữ bằng Cloud Functions

Kết hợp Cloud Functions với Firebase Hosting để tạo và phân phát nội dung động hoặc xây dựng API REST dưới dạng các dịch vụ vi mô.

Cloud Functions for Firebase cho phép bạn tự động chạy mã phụ trợ để phản hồi các yêu cầu HTTPS. Mã của bạn được lưu trữ trên đám mây của Google và chạy trong một môi trường được quản lý. Bạn không cần quản lý và mở rộng quy mô máy chủ của riêng mình.

Để xem các trường hợp sử dụng mẫu và mẫu cho Cloud Functions được tích hợp với Firebase Hosting, hãy tham khảo bài viết tổng quan về dịch vụ phi máy chủ.

Kết nối Cloud Functions với Firebase Hosting

Phần này cung cấp ví dụ từng bước về cách kết nối một hàm với Firebase Hosting.

Xin lưu ý rằng để cải thiện hiệu suất phân phát nội dung động, bạn có thể điều chỉnh các chế độ cài đặt bộ nhớ đệm (không bắt buộc).

Bước 1: Thiết lập Cloud Functions

  1. Đảm bảo rằng bạn đã cài đặt phiên bản mới nhất của Firebase CLI và rằng bạn đã khởi chạy Firebase Hosting.

    Để xem hướng dẫn chi tiết về cách cài đặt CLI và khởi chạy Hosting, hãy tham khảo Hướng dẫn bắt đầu sử dụng Hosting.

  2. Đảm bảo rằng bạn đã thiết lập Cloud Functions:

    • Nếu đã thiết lập Cloud Functions, bạn có thể chuyển sang Bước 2: Tạo và kiểm thử hàm HTTPS.

    • Nếu chưa thiết lập Cloud Functions:

      1. Khởi chạy Cloud Functions bằng cách chạy lệnh sau từ gốc thư mục dự án của bạn:

        firebase init functions
      2. Khi được nhắc, hãy chọn JavaScript (ví dụ từng bước này sử dụng JS).

      3. Kiểm tra để đảm bảo bạn có thư mục functions trong thư mục dự án cục bộ (do lệnh Firebase mà bạn vừa chạy tạo). Thư mục functions này là nơi chứa mã cho Cloud Functions

Bước 2: Tạo và kiểm thử hàm HTTPS cho trang web Hosting

  1. Mở /functions/index.js trong trình chỉnh sửa mà bạn yêu thích.

  2. Thay thế nội dung của tệp bằng mã sau.

    Mã này tạo một hàm HTTPS (có tên là bigben) phản hồi các yêu cầu HTTPS bằng BONG cho mỗi giờ trong ngày, giống như một chiếc đồng hồ.

    const functions = require('firebase-functions/v1');
    
    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. Kiểm thử các hàm của bạn ở chế độ cục bộ bằng Firebase Local Emulator Suite.

    1. Từ gốc thư mục dự án cục bộ của bạn, hãy chạy lệnh sau:

      firebase emulators:start
    2. Truy cập vào hàm thông qua URL cục bộ do CLI trả về, ví dụ: ví dụ: http://localhost:5001/PROJECT_ID/us-central1/bigben.

Hãy tham khảo tài liệu Cloud Functions để tìm hiểu thêm về các yêu cầu HTTPS.

Bước tiếp theo sẽ hướng dẫn bạn cách truy cập vào hàm HTTPS này từ Firebase Hosting URL để hàm này có thể tạo nội dung động cho trang web được lưu trữ trên Firebase.

Bước 3: Chuyển trực tiếp các yêu cầu HTTPS đến hàm của bạn

Với các quy tắc viết lại, bạn có thể chuyển trực tiếp các yêu cầu khớp với các mẫu cụ thể đến một đích đến duy nhất. Các bước sau đây sẽ hướng dẫn bạn cách chuyển trực tiếp tất cả các yêu cầu từ đường dẫn ../bigben trên trang web Hosting đến để thực thi hàm bigben.

  1. Mở tệp firebase.json.

  2. Thêm cấu hình rewrite sau vào phần hosting:

    "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. Xác nhận rằng lệnh chuyển hướng hoạt động như dự kiến bằng cách kiểm thử lại bằng trình mô phỏng Firebase.

    1. Từ gốc thư mục dự án cục bộ của bạn, hãy chạy lệnh sau:

      firebase emulators:start
    2. Truy cập vào URL được lưu trữ cục bộ cho trang web của bạn do CLI trả về (thường là localhost:5000), nhưng hãy thêm bigben vào URL, như sau: http://localhost:5000/bigben

  4. Lặp lại hàm và chức năng của hàm cho trang web của bạn. Sử dụng trình mô phỏng Firebase để kiểm thử các lần lặp này.

Để có hiệu suất tốt nhất, hãy đặt các hàm của bạn cùng với Hosting bằng cách chọn một trong các khu vực sau:

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

Hãy tham khảo trang cấu hình Hosting để biết thêm thông tin chi tiết về các quy tắc viết lại . Bạn cũng có thể tìm hiểu về thứ tự ưu tiên của các phản hồi cho nhiều Hosting cấu hình.

Xin lưu ý rằng để cải thiện hiệu suất phân phát nội dung động, bạn có thể điều chỉnh các chế độ cài đặt bộ nhớ đệm (không bắt buộc).

Bước 4: Triển khai hàm của bạn

Sau khi hàm của bạn hoạt động như mong muốn trong trình mô phỏng, bạn có thể tiến hành triển khai, kiểm thử và chạy hàm đó bằng các tài nguyên dự án thực. Đây là thời điểm thích hợp để cân nhắc việc thiết lập các tuỳ chọn thời gian chạy nhằm kiểm soát hành vi mở rộng quy mô cho các hàm đang chạy trong quá trình sản xuất.

  1. Triển khai hàm cũng như nội dung Hosting và cấu hình vào trang web của bạn bằng cách chạy lệnh sau từ gốc thư mục dự án cục bộ của bạn:

    firebase deploy --only functions,hosting
  2. Truy cập vào trang web trực tiếp và hàm của bạn tại các URL sau:

Sử dụng khung web

Bạn có thể sử dụng các khung web, chẳng hạn như Express.js, trong Cloud Functions để phân phát nội dung động của ứng dụng và viết các ứng dụng web phức tạp dễ dàng hơn.

Phần sau đây cung cấp ví dụ từng bước về cách sử dụng Express.js với Firebase HostingCloud Functions.

  1. Cài đặt Express.js trong dự án cục bộ của bạn bằng cách chạy lệnh sau từ thư mục functions:

    npm install express --save
  2. Mở tệp /functions/index.js, sau đó nhập và khởi chạy Express.js:

    const functions = require('firebase-functions/v1');
    const express = require('express');
    const app = express();
  3. Thêm 2 điểm cuối sau:

    1. Thêm điểm cuối đầu tiên để phân phát chỉ mục của trang web của chúng tôi tại /.

      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. Và một điểm cuối khác để trả về số lượng BONG dưới dạng API, ở định dạng JSON, trong /api:

      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. Xuất ứng dụng Express.js dưới dạng hàm HTTPS:

    exports.app = functions.https.onRequest(app);
  5. Trong tệp firebase.json, hãy chuyển trực tiếp tất cả các yêu cầu đến hàm app. Quy tắc viết lại này cho phép Express.js phân phát đường dẫn con khác mà chúng tôi đã định cấu hình (trong ví dụ này là //api).

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

Thêm phần mềm trung gian

Tiếp tục ví dụ của chúng tôi, giờ đây bạn đang sử dụng Express.js, bạn có thể thêm phần mềm trung gian Express.js theo cách thông thường. Ví dụ: bạn có thể bật CORS yêu cầu trên các điểm cuối của chúng tôi.

  1. Cài đặt phần mềm trung gian cors bằng cách chạy lệnh sau:

    npm install --save cors
  2. Mở tệp /functions/index.js, sau đó thêm cors vào ứng dụng Express.js, như sau:

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

Hãy tham khảo tài liệu Cloud Functions để tìm hiểu thêm về cách sử dụng Firebase với các ứng dụng Express và mô-đun phần mềm trung gian.

Các bước tiếp theo