Đây là phần đầu tiên trong một loạt các bài đăng, trong đó tôi sẽ mô tả các bước để xây dựng danh sách VIỆC CẦN LÀM cho phép hợp tác trong thời gian thực. Điều này có thể hữu ích nếu bạn muốn chia sẻ một số nhiệm vụ với bạn bè và quan sát tiến độ trong thời gian thực.

Trong bài đăng này, tôi sẽ mô tả phần phụ trợ sẽ bao gồm:

• thiết lập API Gateway với hỗ trợ WebSocket
• quản lý các máy khách được kết nối với Lambda và DynamoDB
• nhận tin nhắn và phát nó tới tất cả các máy khách được kết nối

Cơ sở hạ tầng

Thiết lập API Gateway khá đơn giản. Sử dụng cấu trúc WebSocketApi, chúng ta chỉ cần chỉ định các trình xử lý lambda chịu trách nhiệm xử lý các máy khách đang kết nối và ngắt kết nối.

Ngoài ra, để thực sự hiển thị API, chúng ta cần tạo một giai đoạn.

Ngôn ngữ tôi chọn cho lambdas là TypeScript nên tôi sẽ sử dụng cấu trúc NodejsFunction để thiết lập lambdas với hỗ trợ TypeScript.

Bạn có thể nhận thấy rằng tôi đang chuyển TABLE_NAMEdưới dạng biến môi trường cho hàm của mình. Tôi cần một bảng DynamoDB để quản lý các máy khách được kết nối. Hãy thiết lập bảng này với CDK.

Được rồi, tôi vẫn cần thêm một tuyến bổ sung vào API WebSocket của mình để xử lý việc thêm các việc cần làm.

Bước cuối cùng là thiết lập các quyền. Các lambdas của chúng ta cần truy cập vào bảng động lưu trữ các kết nối. Điều này rất dễ dàng với CDK.

Nó addTodoHandlercũng cần một quyền để đăng thông báo cho các máy khách WebSocket được kết nối.

Mã

Phần cơ sở hạ tầng đã xong, chúng ta vẫn cần viết các hàm lambda để:

• xử lý kết nối khách hàng
• xử lý ngắt kết nối khách hàng
• xử lý một hành động thêm việc cần làm

Khách hàng đã kết nối

Trong lambda này, tôi sẽ duy trì ứng dụng khách connectionIdvào một bảng dynamicoDB để nó có thể được tham chiếu sau này.

Ngắt kết nối khách hàng

Tất nhiên khi khách hàng ngắt kết nối, tôi cần xóa nó khỏi bảng.

Thêm một mục việc cần làm

Cuối cùng nhưng không kém phần quan trọng, chúng tôi muốn cho phép các khách hàng được kết nối đăng thông báo. Thông báo này sẽ được phát cho tất cả các máy khách được kết nối với ApiGatewayManagementApi.

Lưu ý rằng chúng tôi không tiếp tục gửi tin nhắn (điều này có thể sẽ được bổ sung trong phần tiếp theo).

Kiểm tra nó

Để kiểm tra API WebSocket, tôi sẽ sử dụng wscat. Để kết nối, tôi thực hiện lệnh này

wscat -c <websocket endpoint>

{"action":"addTodo","data":"hello world"}

Lưu ý rằng thuộc actiontính rất quan trọng ở đây, nó cho phép API Gateway định tuyến thông báo đến một trình xử lý lambda thích hợp.

Tóm lược

Cơ sở hạ tầng đã sẵn sàng! Hoặc ít nhất là phần WebSockets :) Sẽ cần một số tài nguyên bổ sung (như bảng DynamoDB để lưu trữ các việc cần làm và một điểm cuối REST để tìm nạp chúng). Phần giao diện người dùng sẽ được triển khai trong React. Tôi cũng sẽ sử dụng RxJS Observables để quản lý mát-xa từ các kết nối WebSocket. Cảm ơn vì đã đọc và hãy theo dõi phần tiếp theo!