Cách lấy cookie phía máy chủ trong ứng dụng Next.js

Truy cập cookie trong khi hiển thị phía máy chủ trong Next.js có thể khó hơn bạn nghĩ. Đây là cách tôi đã giải quyết nó.

Tôi đã có vấn đề này. Ứng dụng của tôi phụ thuộc vàobánh quyđể xác thực và sử dụng Next.js dường như cookie của tôi không được đặt khi khởi tạo trang đầu tiên.

Tôi có mã này, mã này chịu trách nhiệm đạt được điểm cuối GET bằng cách sử dụngAxios:

Bookings.getInitialProps = async ctx => {
  const response = await axios.get('http://localhost:3000/api/bookings/list')

return { bookings: response.data } }

Tôi có Passport.js trên điểm cuối phía máy chủ, nhưng nó không thể xác thực người dùng trên trang SSR, vì nó không tìm thấy bất kỳ cookie nào.

Tôi đã phải thay đổi mã của mình thành mã này, thêm cookie vàoheaders:

Bookings.getInitialProps = async ctx => {
  const response = await axios({
    method: 'get',
    url: 'http://localhost:3000/api/bookings/list',
    headers: ctx.req ? { cookie: ctx.req.headers.cookie } : undefined
  })

return { bookings: response.data } }

Chìa khóa để làm cho cookie có sẵn trong chương trình phụ trợ là thêm:

headers: ctx.req ? { cookie: ctx.req.headers.cookie } : undefined

vào cấu hình Axios.

Tải xuống miễn phí của tôiSổ tay Next.js


Thêm các bài hướng dẫn tiếp theo: