JWT - Hướng dẫn code chức năng đăng ký, đăng nhập, xác thực, phân quyền ( Hết )

[@quangminh-sn1on]

Anh ơi em dùng redux persist thấy nó lưu trữ dữ liệu trong localstorage nhưng em đọc trên 1 vài trang họ bảo không nên lưu trữ dữ liệu như token lên localstorage bởi nó không an toàn, điều đó có đúng không ạ, mong anh giải đáp.

[@DanielTruongDev]

Redux Persist sử dụng localStorage nha e, sự thật thì store token ở localStorage an toàn hay không thì tuỳ vào ng muốn xâm nhập nữa, một khi ngta đã muốn tấn công r thì e store ở đâu ngta cũng tìm được cách để lấy th, nma thg Redux Persist nó có whitelist với blacklist để e chọn lọc những gì cần store trong localStorage nên nó sẽ tiện hơn

[@quangminh-sn1on]

@@DanielTruongDev Vâng em cảm ơn anh nhiều ạ.

[@TuanAnhNguyen-yb5ng]

@@quangminh-sn1on Dạ anh ơi, nếu lấy đc token thì ta giải mã để lấy secret key đc đk ạ

[@duynd243]

@@TuanAnhNguyen-yb5ng accessToken ko thể giải mã ra được secretKey bạn nha. secretKey được lưu ở backend, và dùng để generate ra 1 accessToken hợp lệ, cũng như verify accessToken từ client gửi lên có đúng là đã được sign với secretKey kia hay không.

[@TungNguyen-oi4xo]

@@duynd243 nếu ko giải mã đc vậy nó lấy đc accessToken cũng như không hả, hay nó lấy vì mục đích gì khác bạn

[@nhantrong7688]

cảm ơn bạn rất nhiều về chuỗi series này, mình loay hoay mò mãi mà rất rối vì ko biết nên lưu thế nào, setup làm sao. Nhờ series này mà phần Authenticated của mình cũng tạm ổn. Chúc bạn sức khoẻ và thành công nha.

[@duyvan1582]

xem 3 video của anh mà xem đến đâu cũng thấy hợp lí ngắn gọn, tư duy đỉnh quá anh ơi

[@daingo3694]

Cảm ơn anh rất nhiều, video quá nhiều điều hay, mặc dù em đã xem nhiều về jwt nhưng video này của anh vô cùng giá trị đối với em. Cảm ơn anh rất nhiều, chúc anh luôn mạnh khỏe.😍

[@DanielTruongDev]

cảm ơn e, e thấy hữu ích thì like với sub để ủng hộ anh nhe 😋 chúc e mạnh khoẻ

[@ekkoinc1190]

em thấy mình dùng react để fontend ngoài cái này mình dùng handlebars dùng kèm với nodejs cách nào dùng sao a ạ

[@james-rx8kw]

cảm ơn bạn rất nhiều đúng , mình đang thực tập và đang làm task này nên hơi loay hoay coi video của b xong thấy được vấn đề

[@alicutun9151]

cám ơn vì video rất ngắn gọn dễ hiểu.. nhiều video kênh khác làm lang mang quá.. 1 lần nữa xin cám ơn bạn

[@quocdungnguyen615]

Quá hay, quá bổ ích bạn ơi !

[@hungminhphan6095]

sao lúc decode jwt mình ko lấy 2 cái thời gian trong deocde trừ nhau mà lấy cuurent time v a

[@phihungvohoang7103]

Anh ơi cho em hỏi, khi cookie hết hạn và state redux toolkit hết hạn làm sao để force logout người dùng vậy anh

[@phongtienbao9252]

vậy dùng redux persit nhưng có một số thứ em muốn bỏ qua sau mỗi lần khởi động lại thì làm sao ạ

[@ldtt2004]

anh ơi sao lúc em thêm axiosJWT vô getAllUsers và useEffect thì khi load trang lại đăng nhập vào tk user mục user list của e không có dữ liệu nào hết đồng thời bên redux thông báo là users/getUserFailed thì sửa sao vậy anh?

[@TungNguyen-oi4xo]

Có thể dùng send công dụng của nó cũng giống như return vậy em

[@YunaCrystal3009]

Em có làm theo video của ảnh đến đoạn dùng interceptor request axios ở FE thì gặp vấn đề về việc call request liên tục. Không biết sửa như thế nào

[@duyminh7799]

Mn ơi cho mình hỏi phần này mình áp dụng được cho các chủ đề khác không ạ

[@lucnguyeninh1057]

Thay vì dùng trycatch ở chỗ promise mình dùng then,catch thấy ok hơn

[@bestmidlink]

Bạn cho mình hỏi khi mình logout á thì mình phải refresh lại thì mới đăng nhập đc nó là lỗi ạ ?

[@buihuyduoc1701]

sao localhost mà lại dùng cookie được nhỉ, em đang dùng chrome nó không chạy được

[@nheogentle]

chào anh, anh em có thắc mắc như này ạ, ở phần getAllUser thì làm thế nào để khi xóa một user thì tự động render lại ạ.

[@phat1106]

bạn làm video về ghi log, unit test hay debug đi ít người làm mấy nội dung ấy lắm, thường thì vô cty ms đc train mấy thứ đấy

[@tuanngo8848]

hay quá bạn ơi

[@giabaonguyenhoang2721]

e thay bằng mysql vs sequelize chắc cũng có vấn đề gì đâu a nhỉ, cám ơn a đã chia sẻ :>

[@quannguyenviet643]

anh ơi em có 2 câu hỏi: 1 là thay vì tạo api request thì mình dùng redux thunk được k ạ. 2 là nếu làm được phía BE như thế này thì mình di thực tập được chưa ạ

[@longchu2980]

1: Trong video có ns rồi 2: Thực tập đc hay ko phải do bên tuyển dụng nhé

[@attran3828]

cám ơn anh. em đã làm được nhưng chỉ có phần khi người dùng thoát xong vô lại thì em ko hiểu. cái đoạn redux persist là lưu cái gì ở trong đó vậy anh.

[@montagetime5133]

vậy nếu tìm kiếm filter thì làm như thế nào

[@luantran7118]

extension hay cái gì báo lỗi đỏ gạch chân khi a code sai ấy nhỉ, cho e xin tên với.

[@nhatleminh9176]

Video rất hay mình cám ơn bạn nhiều.

[@thanghohuu2346]

cho em hỏi là mình dispatch async action login/register sử dụng axios thì không cần sử dụng middeware như thunk/saga nữa à anh?

[@CunsEntertainment]

Bạn ơi cho mình hỏi xíu là tại sao mình lúc gọi API login thì login được nhưng nó không lưu cookie phần refresh token vào. Vì khi mình gọi API refresh thì nó không có lấy được cookie, và mình kiểm tra lại nhiều lần thì nó cũng không lưu và không lấy được, bạn có biết cách khắc phục không ạ, mình cảm ơn. i lop duuuuu

[@coding-longus]

Bạn có deploy con node đó k

[@tanbinhvlogs6042]

anh ơi, cho em hỏi, phần backend của anh, em tải về rồi, thì làm sao để chạy v a, em đang học frontend, nên k biết chạy back end, set up file của anh ntn

[@duyvan1582]

anh ơi cho em hỏi sao mình gọi api , cái url mình ko cần localhost:8000 vậy ạ., vì em thấy front end chạy trên port 3000, mà backend chạy trên port 8000

[@nguyentaik2]

thiết lập proxy trong packet json fe là localhost:8000 là đc

[@thanhtrungnguyen1684]

cho mình hỏi thê isAdmin true vs false để lưu data làm sao thể

[@dovan4386]

anh ơi sao em thêm vài cái state khác ngoài user nhưng vào redux tool trên browser nó k hiện ra vậy anh

[@DanielTruongDev]

nếu em add state mới sau khi thêm redux-persist thì em phải vào Localstorage trên browser của em r clear nó á, do lúc em xài thử redux persist là nó lưu vào localstorage trên browser nên em thêm state sau đó thì nó kh lưu lại

[@lehuynhtran6612]

Em cam on anh rat nhieu !

[@thiettruong6328]

Bị lỗi không gắn được cookie cho cái refresh token, có ai fix được giúp mình với

[@Tech4Projects]

a ơi cho em hỏi ở phút 59:53 nếu mình xóa thiệt và muốn nó loading lại trang để render ra các tk mới thì làm sao vậy ạ

[@bachkhoait4.052]

Minh đã hoàn thành 3/3 cảm ơn bạn nhìu

[@caotichcuc]

anh ơi cho em hỏi anh có bị lỗi Module parse failed: Unexpected token (11:22) You may need an appropriate loader to handle this file type. | var HomePage = function HomePage() { | var user = useSelector(function (state) { > return state.auth?.login.currentUser; | }); | var dispatch = useDispatch(); nêu có anh cho em xin cách khắc phục nha, em cảm ơn.

[@binhlethanh4121]

Mình thấy code theo cách trong video này sẽ phát sinh rất nhiều lỗi logic. Mấy bạn ko có kinh nghiệm xử lý thì rất khó.

[@javascript2797]

Sao không có video đăng nhập cho người dùng ạ:((

[@nocode28]

43:50 em thêm headers rồi nhưng vẫn bị hiện chưa xác thực thì thường lỗi ở đâu anh.

[@d13cnpm1_nguyenphuongnam8]

anh không hướng dẫn xử lý gọi refesh token trên frontend hả anh, tại em thấy phần 2 anh có viết api xử lý refresh token

[@DanielTruongDev]

ở 01:09:00 á em, em check mốc tgian á

[@d13cnpm1_nguyenphuongnam8]

@@DanielTruongDev dạ vâng em cảm ơn anh ạ, anh cho em hỏi chút ạ , là khi check refresh token lại đi so sánh tgian expired token với tgian hiện tại là sao anh nhỉ

[@phucthanhnguyen9671]

Anh ơi cho em hỏi, có phải lúc mình gọi hàm loginUser rồi truyền vào dispatch là mình đang thực hiện bất đồng bộ trong redux phải không ạ?

[@javascript2797]

Cho em hỏi sao e tải về npm install nó bị lỗi .anh dùng bản node js nào v ạ

[@DanielTruongDev]

a xài node19 á, em check xem em có vào đúng folder để npm install chưa, có gì lên Discord hỏi cho dễ nha

[@hqb4344]

mình cũng bị lỗi đó dù vào đúng folder

[@cuongngo8207]

code frontend tren github ko du ban oi

[@uuu6882]

bác giỏi quá

[@xcode28]

cho em hỏi, chỗ login, giả sử login sai cái là cái server nó tự tắt luôn thì phải làm sao anh, em mới học nodejs ạ.

[@DanielTruongDev]

là nó bị crash đó e, nếu e dính lỗi Error HTTPS thì e thêm chữ return trước res.status nhe

[@bdsyendinh]

Anh ơi cho em hỏi là Trường hợp là nếu một browser, cùng một domain mà mở nhiều tab: - Khi token hết hạn * Liệu refresh_token có được gọi nhiều lần cùng lúc (tương ứng số tab). * Mình sẽ xử lý như thế nào ở trường hợp nhiều requests với cùng một refresh_token được gọi cùng lúc.

[@thanh8699]

cái redux persist lưu vào localstorage. vậy thì cái token ko nên lưu trong localstorage thì xử lý làm sao ạ

[@DanielTruongDev]

b đọc bình luận ghim của mình nhé, mình có trả lời r đấy, b có thể store trong httpOnlycookie, nhưng nói chung thì cái nào cũng có điểm yếu của nó cả nên kh cách nào là an toàn nhất, b có thể tìm hiểu phương pháp “backend for frontend” thì cách đó có lẽ là an toàn nhất đấy, nhưng cơ bản do access token kh an toàn bởi thế nó mới ngắn hạn để dù có bị lộ thì vài giây sau ngta kh sử đụng dược nữa và refreshtoken nằm trong cookie của b r

[@HưngPhanMinh-g2v]

sao frontend port 3000 backend port 8000 mà gọi được vậy a

[@OpenSwi]

thì phải chạy trên 2 cổng mới kết nối được mà

[@HưngPhanMinh-g2v]

@@OpenSwi nhưng nó khác origin mà

[@OpenSwi]

@@HưngPhanMinh-g2v tui tưởng sau 1 tháng thì ông biết cái này rồi chớ, thì dùng cors là xong có gì đâu, này mô hình client - server mà

[@thinhbui2179]

ở phút 19:18, e lm như a mà nó k thấy hiện redux mà code k báo lỗi thì e phải sửa ở đâu ạ? e clone git của a về và thử inspect cũng k thấy redux như a

[@DanielTruongDev]

e phải cài redux devtool extension mới có nhe

[@kitygaming3668]

vì sao localhost trong frontend là 3000 mà trong backend lại để 8000 ạ

[@OpenSwi]

phải chạy trên hai cổng khác nhau mới giao tiếp được chứ

[@ryugaryuzaki2728]

Tôi dùng react 18 bị lỗi depatch redis-toolkit, a chỉ tôi cách sửa lỗi này với, tôi có xem stack thì nói chưa update bản v1.8.0, thank Daniel

[@nguyenthanhbinh9598]

vl google dịch à, sao xưng hô kì thế

[@toanta4838]

Uncaught (in promise) Error: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons: 1. You might have mismatching versions of React and the renderer (such as React DOM) 2. You might be breaking the Rules of Hooks 3. You might have more than one copy of React in the same app Em bị lỗi này mà đọc k hiểu lắm

[@DanielTruongDev]

em xem là em có xài Hook sai cách như em bỏ Hook vô trong function chẳng hạn kh?

[@NhatNguyen-zg6il]

Quăng thêm phần code Redux lên Git đi ông, link git chưa push phần đó lên ấy

[@coding-longus]

đổi branch trong git là có đó bạn

[@quangtrungtran7480]

Anh ơi sau khi login xong thì res.cookie nó không thêm cái refresh token nào mặc dù e có cài cookie-parser rồi

[@binhlethanh4121]

bên phía react chỗ login thêm {withCredentials: true} và bên backend sửa lại app.use(cor()) thành app.use((origin: "localhost:3000", credentials: true,));

[@ngocduongofficial290]

@@binhlethanh4121 anh ơi , em đã làm theo anh , nhưng cookie vẫn không được gắn vào ạ

[@nguyenviet5910]

@@ngocduongofficial290 port backend trùng với proxy là được nha bn

[@cauvang8204]

sao của em nó toàn registerFail hoài :")

[@nhuttran8861]

anh ơi em bị lỗi như thế này : Error: error:0308010C:digital envelope routines::unsupported at new Hash (node:internal/crypto/hash:68:19) at Object.createHash (node:crypto:138:10) at module.exports nhờ anh và mọi người giúp em với ạ :((

[@LinhNguyen-gm2en]

thay dòng script trong package.json thành như thế này là chạy được nè "start": "react-scripts --openssl-legacy-provider start",

[@navuong7953]

chỗ logout 1:44:31 mình để logout bị lỗi là do store không cập nhật lại lúc mình thêm logout vào state trong authSlice đúng không bạn?

[@DanielTruongDev]

ừa chắc lúc đó mình chưa load lại trang nên có thể do v nên nó bị lỗi 😋

[@navuong7953]

@@DanielTruongDev hình như load lại cũng không được bạn ạ mình phải vào local storage xoá rồi f5 nó mới nhận, bạn có cách nào khắc phục luôn không?

[@DanielTruongDev]

@@navuong7953 bạn thử thay đổi đại gì đó trong cái store.js r bạn save lại để thg redux-persist nó được update thì lúc đó bạn dùng cái redux extension thì sẽ thấy có cái state logout, bạn thử xem

[@navuong7953]

@@DanielTruongDev mình thử rồi nhưng nếu mình thêm vào store một slice mới thì nó nhận còn nếu mình thêm trường vào state của slice cũ thì nó không nhận bạn ạ

[@DanielTruongDev]

@@navuong7953 do thg redux-persist nó lưu trong local storage ấy b, nên b muốn nó update thì phải clear local storage, còn tối ưu nhất thì b có thể search về “black list, white list” trong redux-persist để chọn lọc state nào mình muốn persist còn state nào mình kh muốn. Theo mình thì state nào mình biến đổi nhiều thì cho nó vào black list còn state nào mình ít động và muốn nó persist như kiểu userID, tên user này nọ thì cho vào white list

[@DenDenCover]

khi user login success thì mn mở browser vào cookie có thấy refreshTk ko ạ. Em mở nhưng không thấy. và khi call refreshToken để lấy tk mới thì bị message: "Network Error". Mn chỉ em vì sao bị với ạ tks mn

[@luantran7118]

b dùng react18 à, mình đang bị lỗi y hệt b

[@nhattrinhminh1014]

@@luantran7118 mình cũng thế cứ tưởng chắc có mình bị nhưng cũng nhiều người bị lỗi tương tự

[@binhlethanh4121]

bên phía react chỗ login thêm {withCredentials: true} và bên backend sửa lại app.use(cor()) thành app.use((origin: "localhost:3000", credentials: true,));

[@binhlethanh4121]

@@luantran7118 bên phía react chỗ login thêm {withCredentials: true} và bên backend sửa lại app.use(cor()) thành app.use((origin: "localhost:3000", credentials: true,));

[@binhlethanh4121]

@@nhattrinhminh1014 bên phía react chỗ login thêm {withCredentials: true} và bên backend sửa lại app.use(cor()) thành app.use((origin: "localhost:3000", credentials: true,));

[@nhattrinhminh1014]

Mình không biết sao nhưng khi mình login thành công thì rõ có trẻ về set-cookie nhưng cookie đó lại không được lưu trong trình duyệt nên không thể gọi refreshToken()

[@quangtrungtran7480]

bạn fix đc chưa vậy. mk cũng bị như thế

[@binhlethanh4121]

bên phía react chỗ login thêm {withCredentials: true} và bên backend sửa lại app.use(cor()) thành app.use((origin: "localhost:3000", credentials: true,));

[@DuyNguyen-qd2fh]

@@binhlethanh4121 bạn có thể giải thích rõ hơn giúp mình tí được không, mình cũng bị lỗi như vậy nhưng vẫn chưa fix được.

[@binhlethanh4121]

@@DuyNguyen-qd2fh Khi dùng ở local để tránh bị lỗi CORS thì ở Node JS người ta sẽ cài một thư viện là cors. ---> sau khi cài thì ở file index.js hay server.js (do mỗi người đặt) mình sử dụng : app.use(cors()). Để trả về cookies lưu trên trình duyệt thì thông thường sẽ thêm vào origin, và credentials. origin : link chạy của bên phía React js (localshost:3000) .

[@binhlethanh4121]

nhưng Trong dự án thực tế bạn ko nên làm cách này. Bạn nên check token hết hạn và gọi refreshToken thay vì ở interceptors.request.use thì người ta sẽ thực hiện nó ở interceptors.response.use() ==> cách này đảm bảo ko cho bên ngoài có thể can thiệp vào. cách này cũng dễ khi mở rộng dự án thì có thể lưu trong redis.

[@toanta4838]

Lú vãi , khs có mỗi cái lỗi return config mà e quên k viết ra ngoài lỗi tùm lum ! Chịu luôn @@

[@nammaivan4739]

Mình xin tên Cái extension xem api luôn trong vs code

[@DanielTruongDev]

mình có để trong phần mô tả ấy bạn

[@NhatNguyen-ej6ls]

sao mình làm như bạn mà phía client k có cookie nào hết

[@DanielTruongDev]

b có thêm withCredentials:true ở phía client chưa

[@NhatNguyen-ej6ls]

@@DanielTruongDev có thêm nhưng check trong application cookie k thấy có, check trên server gửi lên cũng k luôn

[@phamvantuan3010]

@@DanielTruongDev mình cung bị vậy nếu Mình thêm withcredental ở axios.create thì bị cors bị block hết req luôn

[@hoangnguyensong2699]

@@DanielTruongDev a ơi em cũng bị trường hợp như vậy. anh có thể hướng dẫn mọi người fix lỗi được k ạ

[@DanielTruongDev]

mấy b vào group Discord hỏi để được hỗ trợ nhanh nhất nhe

[@BDCVT-oanXuanTruong]

code trên github của anh không đủ

[@DanielTruongDev]

e có đổi branch chưa, do có 2 branch main với starter-frontend đấy

[@ThanhLam-qd4wg]

của mình cứ bị login Failed ý ai giúp mình với huhu

[@28.hungtaiquach48]

mình cũng v , mng có ai có cách k ạ:(

[@quanghavan3693]

giải quyết đc vấn đề đó ch b:))

[@truonghuynh2788]

Bạn học nodejs ở khóa học nào v :))

[@DanielTruongDev]

mình tự học hết á bạn

[@truonghuynh2788]

@@DanielTruongDev great :))

[@levanduy5982]

ai co source code đủ có frontend backend cho em xin vs ạ

[@phuquang8558]

.

[@luantran7118]

1:43:03 làm đi làm lại, xem mãi lại code, vẫn lỗi chỗ refreshtoken.

[@quangtrungtran7480]

cho hỏi bạn fix dc chưa vậy

[@binhlethanh4121]

Bạn ko nên code theo cách trong video này. Cách code này tồn tại rất nhiều lỗi logic. Ko có kinh nghiệm xử lý thì rất khó.

[@thienzai8234]

24:10 thêm cái await vào là bị như này là sao ạ??? Proxy error: Could not proxy request /v1/auth/login from localhost:3000 to localhost:8000/.

[@duyvan1582]

bạn ơi thông chưa, cho mình hỏi chút

[@nghiapro2611]

Phải set axios.defaults.withCredentials = true; mới lấy dc refresh token, ko thì cứ bị 401 thôi

[@DanielTruongDev]

thì trong video mình có set mà b

[@hoangnguyensong2699]

a ơi mình làm theo nhưng bị lỗi 403. bạn chỉ mình cách sửa với dc k ạ

[@hunghovan3958]

@nghiapro2611 set cái axios.defaults.withCredentials = true này ở đâu vậy bạn, lên server xem thì nó k nhận refresh token nên cx bị lỗi 401