Làm sao để client gửi header có kèm authentication

Chào mọi người, mình đang tự code một trang web, mình học nhiều về phía back end hơn cụ thể là framework Nestjs của nodejs. Api mình code yêu cầu authentication bearer đính kèm vào header để gửi đi. Code hết api mình chuyển sang code front end cho web.
Vấn đề xảy ra là khi mình code api toàn dùng post man, ở đó có tab header để mình thêm vào. Nhưng khi request bằng browser thì làm sao browser có thể biết để gửi cả header lên khi request.
Mình có ý tưởng là dùng ajax gọi nhưng mà nếu thế:

  • Khi người dùng request, router từ server xử lý và trả về dữ liệu cùng view cho request
  • Lúc đó view mới được load, ajax lúc này trong view mới gửi request tiếp theo kèm header (mất một khoảng thời gian từ lúc load view đến lúc server xác nhận token và trả về, kết quả là mất một thời gian trang mới redirect nếu token đúng)
  • success của ajax mới nhận và xử lý kết quả trả về.
    Mọi người cho mình hỏi có cách nào mà không bất tiện như trên mình trình bày không, cả về phía client và server (nodejs) luôn.
    Mình cảm ơn
1 Like

Dùng Cookie. Muốn an toàn thì thêm SameSite, HttpOnly với Secure vào.

2 Likes

Ý mình là làm sao để client luôn gửi token(nếu có) trong header cơ, cảm ơn bạn

Thì save token vào cookie chứ sao, header tự động đính kèm cookie mà.
Còn nếu token bị thay đổi với mỗi request thì phải chấp nhận những cách loằng ngoằng thôi :smile:

3 Likes
  1. Lưu Token vào localstorage
  2. Ở Client tạo 1 instance của axios đọc header từ localstorage đính với request (dạng: Authorization: Bearer TOKEN rồi gửi.
  3. Hoặc bạn có thể sài nestjs kết hợp với nextjs, nuxtjs để render luôn trên server router đơn giản hơn spa mà dễ SEO.
3 Likes
83% thành viên diễn đàn không hỏi bài tập, còn bạn thì sao?