Headers & Session Auth
Dự án không có xác thực chỉ sử dụng createHttpClient, và chỉ thêm HeaderStore và session auth khi cần.
Mã commonService.ts trên trang này là một phần của toàn bộ tệp.
Mã HeaderStore, headersProvider, sessionAuth dưới đây không phải là ví dụ tệp độc lập mà là phần giải thích từng phần của bộ chuyển đổi HTTP chung của dự án (rxjsHttpService.ts/commonService.ts). Nếu bạn muốn xem cấu trúc tệp đầy đủ, hãy kiểm tra mã hoàn chỉnh/tối thiểu của HTTP Client trước khi đọc trang này.
header chia sẻ trên trình duyệt
Các header như access token nhận được sau khi đăng nhập mà nhiều dịch vụ cần sử dụng cùng nhauHeaderStorecó thể được lưu trữ trong.
commonService.ts
tsTrong Next.js, phân chia header giữa trình duyệt và máy chủ.
Trong Client Component, đọc HeaderStore, trong Server Component, đọc cookie. headersProvidercó thể được tạo ra. Hàm này cho phép tách biệt cách truy xuất header cho CSR và SSR ở một nơi.
commonService.ts
tsheadersProviderNếu truyền vào, sẽ sử dụng kết quả của provider khi yêu cầu. Nếu trả về HeaderStore trực tiếp trong provider khi là trình duyệt như ví dụ trên, có thể xử lý CSR và SSR tại một nơi.Nếu cần refresh 401, hãy bọc callApi một lần.
Đừng sửa từng dịch vụ tự động tạo, hãy thêm session operator vào dịch vụ công cộng.callApiVậy thì tất cả các dịch vụ tạo ra sẽ sử dụng cùng một quy tắc truy vấn và refresh token.
commonService.ts
tsNếu không có Authorization, hãy kiểm tra endpoint token trước, nếu yêu cầu gốc là 401 thì sẽ yêu cầu lại sau khi refresh. Nếu refresh cũng thất bại, gọi endpoint logout và truyền lỗi gốc.
Khi chỉ cần đồng bộ token mà không cần refresh/retry.
Để chỉ đồng bộ token trước yêu cầu mà không sử dụng refresh/retry 401, hãy sử dụng withEnsureToken().
Nếu không cần xác thực
API công khai hoặc dự án đơn giản thì điều này là đủ. HeaderStore và session auth không phải là cấu trúc bắt buộc.