Redux Saga: 17 - Cài đặt 2 tasks login và logout

Hoàn thiện tính năng login với việc cài đặt 2 hàm login và logout từ video trước.

#reactjs
#redux_saga
#typescript

Trở thành FAN CỨNG để hưởng được nhiều quyền lợi ưu tiên:

----
Khoá học ReactJS cho người mới bắt đầu trên Udemy của mình
🎁 Giá ưu đãi được đính kèm trong link 😉

-----
💻 Easy Frontend 🎉

Nơi kiến thức lập trình web frontend (html/css/javascript/reactjs) được chia sẻ một cách đơn giản, dễ hiểu mà đặc biệt là vui 😊 Với những tài liệu (tutorial) được biên soạn một cách kĩ lưỡng để giúp các bạn developer mới có thể nắm bắt vấn đề một cách nhanh chóng và hiệu quả. Từ đó nâng dần khả năng coding của các bạn lên theo thời gian.

❤️ Ủng hộ mình làm videos thì đóng góp qua MoMo/ZaloPay: 0901 309 729 nhé!

Kết nối với mình:

[KhangNguyen-kqiw]

em mày mò mãi mới đăng kí trở thành Easier đc hehe. Nhìn seri Redux Saga xịn xò ghê luôn. Rất may mắn khi biết được kênh của anh Hậu🎉🎉 (Bài viết mang tính chất khoe huy hiệu kk)

[anhtu]

công nhận thằng saga này đau não quá anh. Cơ mà xem chậm chậm lại cũng thấm thấm đc. Cảm ơn anh nhiều nhé, anh giảng có tâm lắm luôn

[trongnguyenduy]

Cảm ơn a, bài giảng dễ hiểu quá <3

[duonginhxuan]

Cái phần while (true) có một cấn đề(em nghĩ sẽ có người mắc phải giống em).

Nếu em call API xảy ra error(ví dụ trên server bắt validation trả về 422) => em thay đổi value => đăng nhập lại thì nó sẽ luôn luôn không nhẩy được vào phần watchLoginFlow nữa do thg logout chưa được dispatch.

Hiện xử lý em đang put authAction.logout trong phần catch. a có hướng nào hay hơn k a

[ThangTran-feoz]

Cho em hỏi là nếu backend có trả về token thì mình sẽ lưu token vào localstorage ở giai đoạn nào ạ. Lưu trong function call Api, trong Saga hay là trong reducer ạ

[congminh]

E chào anh
A ơi bây giờ e muốn handle cái message từ api trả về thì m dùng như thế nào vậy ạ
Em cám ơn anh.

[edwardv]

dòng fork(handleLogin, action.payload) e đổi thành call(handleLogin, action.payload) được ko a, vì nếu handleLogin (gọi api... hầm bà lằng quá lâu), trong khi đó user đã logout (chưa login xong -> chưa có access_token để remove) thì flow sẽ thay đổi liền a.

[vuongnh]

chỗ mà fork login thì em nghĩ nên để là call sẽ hợp lý hơn, em có đọc cmt phía dưới là mình sẽ để cái take logout vào cái else để tránh trường hợp đăng nhập thất bại thì nó sẽ không take cái login nữa, tại vì nếu mình fork login trong lúc đang gọi api thì nó sẽ quay lại vòng while true ngay lập tức và kiểm tra token do đang call api nên token vẫn chưa có và nó lại nhảy vào take login, sau khi call api xong đăng nhập thành công thì sẽ không gọi được cái logout nữa. Nên em nghĩ để call thì nó sẽ đợi call api login xong thì mới quay lại vòng while true

[kingwisdomm]

a ơi cho em hỏi tại sao mình không thay watchLoginFlow thành 2 cái saga watchLogin và watchLogout riêng ạ
VD: watchLogin() {
if(!isLoggedIn){
yield takeEvery(authAction.login.type, handleLogin)
}
}

[thanhvinhle]

a hậu cho e em hỏi call(block), fork và spawn(non-block), e đã xem bài phần biệt giữa fork và spawn và đã hiểu nhưng e chưa hiểu sự khác biệt giữa call vs fork và spawn ngoài cái block và non blocking thì nó còn khác nhau gì không ạ.em cảm ơn ạ

[johnnytringuyen]

anh hậu ơi cho em hỏi, trong trường hợp login api trả về error thì mình muốn login lại, nhưng trong vòng lặp while true này nó cần phải watch thằng logout tiếp theo thì nó mới quay lại thằng login dc, vậy có cách nào để mình check login thành công mới chạy tiếp vòng lặp sang logout không anh

[zhenguet]

a có up các bài code lên github không ạ?
Nếu có a public ở mô tả được không ạ?

[phamquoctuan]

Chào anh Hậu, em không hiểu sao mà em bật cái devTool check action thì nó không hiện action logout mà em log ra được handle logout
với cả em configureStore giống anh thì nó cũng không dispatch được cái action logout anh ạ

[minhsangnguyen]

Cảm ơn anh nhiều, mà anh cho em hỏi xíu là nếu muốn gắn thêm logout vào thì phải làm sao ạ mong anh gợi ý.

[phanhaiang]

em làm theo flow vậy nhưng sau login lần đầu thất bại thì mấy lần sau dispatch action login thì authSaga không chạy nữa ạ

[minhtainguyen]

a demo thêm phần refresh token được không a

[tungls]

Mong anh ra 1 hướng dẫn phần login, logout có call API trong khoá này luôn. Em chuyển từ thunk qua, API của em trả về json-token

[TomsFarm]

Hi a ơi giúp e với, e gắn api login. Khi click login lần đầu bị lỗi thì báo lỗi. Nhưng khi click tiếp login thì không được nữa, saga nó không lắng nghe login lần sau :(

[minhducofficial]

Anh Hậu ơi, ví dụ như em dispatch 1 sagas để call api thành công, em đang muốn xử lý nhiều thứ sau đó ví dụ như việc em tắt cái modal đó và show lên toast là success ( ngoài ra còn xử lý nhiều thứ nữa ) ... em đang chờ flow để xử lý phần này của anh ạ, hy vọng sẽ có được phần góp ý của anh.

[TheSweetlove]

Có bài nào chi tiết mấy cái handle này ko anh?