Tích hợp Next.js

Khi sử dụng CLI Firebase, bạn có thể triển khai các ứng dụng web Next.js của mình lên Firebase và phân phát chúng bằng Firebase Hosting.

Phân phát nội dung tĩnh

Sau khi khởi chạy Firebase, bạn có thể phân phát nội dung tĩnh bằng lệnh triển khai tiêu chuẩn:

firebase deploy

Nếu ứng dụng của bạn có logic linh động phía máy chủ, thì CLI sẽ triển khai logic đó đến Cloud Functions for Firebase. Bạn có thể xem ứng dụng đã triển khai trên trang web đang hoạt động của ứng dụng đó.

Kết xuất trước nội dung động

CLI Firebase sẽ phát hiện việc sử dụng getStaticPropsgetStaticPaths.

Không bắt buộc: tích hợp với Firebase JS SDK

Khi đưa các phương thức Firebase JS SDK vào cả gói máy chủ và gói ứng dụng, hãy ngăn chặn lỗi thời gian chạy bằng cách kiểm tra isSupported() trước khi sử dụng sản phẩm. Không phải tất cả sản phẩm nào cũng được hỗ trợ trong mọi môi trường.

Không bắt buộc: tích hợp với SDK của Firebase dành cho quản trị viên

Các gói Admin SDK sẽ không hoạt động nếu được đưa vào bản dựng trình duyệt của bạn; chỉ tham chiếu các gói đó trong getStaticPropsgetStaticPaths.

Phân phát nội dung hoàn toàn động (SSR)

CLI Firebase sẽ phát hiện việc sử dụng getServerSideProps. Trong những trường hợp như vậy, CLI sẽ triển khai các hàm đến Cloud Functions for Firebase để chạy mã máy chủ động. Bạn có thể xem thông tin về các hàm này, chẳng hạn như cấu hình miền và thời gian chạy, trong bảng điều khiển Firebase.

Định cấu hình hành vi Hosting bằng next.config.js

Tối ưu hoá hình ảnh

Bạn có thể sử dụng Next.js Image Optimization (Tối ưu hoá hình ảnh Next.js), nhưng thao tác này sẽ kích hoạt việc tạo một hàm (trong Cloud Functions for Firebase), ngay cả khi bạn không sử dụng SSR.

Lệnh chuyển hướng, Lệnh viết lại và Tiêu đề

CLI Firebase tuân theo lệnh chuyển hướng, lệnh viết lạitiêu đề trong next.config.js, chuyển đổi chúng thành cấu hình Firebase Hosting tương đương tương ứng tại thời điểm triển khai. Nếu một lệnh chuyển hướng, viết lại hoặc tiêu đề Next.js không thể chuyển đổi thành tiêu đề Firebase Hosting tương đương, thì lệnh đó sẽ quay lại và tạo một hàm – ngay cả khi bạn không sử dụng tính năng tối ưu hoá hình ảnh hoặc SSR.

Không bắt buộc: tích hợp với tính năng Xác thực Firebase

Công cụ triển khai Firebase có nhận biết khung web sẽ tự động đồng bộ hoá trạng thái máy khách và máy chủ bằng cookie. Có một số phương thức được cung cấp để truy cập vào bối cảnh xác thực trong SSR:

  • Đối tượng res.locals Express sẽ tuỳ ý chứa một phiên bản Ứng dụng Firebase đã xác thực (firebaseApp) và người dùng hiện đang đăng nhập (currentUser). Bạn có thể truy cập vào đối tượng này trong getServerSideProps.
  • Tên ứng dụng Firebase đã xác thực được cung cấp trên truy vấn tuyến đường (__firebaseAppName). Điều này cho phép tích hợp thủ công trong khi ở trong bối cảnh:
// get the authenticated Firebase App
const firebaseApp = getApp(useRouter().query.__firebaseAppName);