如何在 httpOnly cookie 中使用 JWT 令牌来调用受限的 api 端点

Question

我正在使用next.js和next-auth来针对 API 登录用户。 如果登录成功，则会为浏览器设置一个 httpOnly cookie。 cookie 名称是__Secure-next-auth.session-token ，这是值（不用担心是假数据）：

eyJhbGciOiJIUzUxMiJ9.eyJ0b2tlbiI6ImV5SjBlWEFpT2lKS1YxUWlMQ0poYkdjaU9pSlNVekkxTmlKOS5leUpwWVhRaU9qRTJNelkyTXprMk5EY3NJbVY0Y0NJNk1UWXpOalkwTXpJME55d2ljbTlzWlhNaU9sc2lVazlNUlY5VlUwVlNJbDBzSW5WelpYSnVZVzFsSWpvaVpYSnVZVE01UUhkbFltVnlMbU52YlNKOS5obWZqQ3NBWDFsWHdCMWdUNDlRUFdRWjM4OG52b2pKTlJMaDI1d3RCTVlBSHhQN2RxelpsZWFzTWZSVXZqSmJXVjdRUldYZnRYYUJFOG1pTEE4Y1JsNTVlZUd5bE9MbHhoQVRORTZPNjZLQjdzMXhPczB6Nmg1TXFadnlRa3JhcjFfYnF5WXgzQzBZdXVHWk1NWEFMUDJPS3Q5Sjk2dVdZVF9KT25USzNhRTZEQnpqaWF5OWw2alludExLZkUyQUhKMVgwVE9UcEN3QjBHeFB3d1otVWh0NjU5NEtLZS0yakpkQmhqd185VGJWSUVFaV9SbF8zMDFabmhHdDZZYzN6SE9WNm9WSk4zOTBSTXFrM283cWRONkw0R0JKb1g5NzQ1NkNJLTVFSllJN3ozcXpjVEwtZUNGc3luRkJIZHEzNnF2TFd3aDJpeDVkTy1MVDU1cXE5VlEiLCJpYXQiOjE2MzY2NTcwNjYsImV4cCI6MTYzOTI0OTA2Nn0.QGRPwJSECbFfkvUyn8h-gInELUzGHsxBFrnMAW9zEfqCuHwJRkT1aunqFt7g5aWp6DZrSUHaKvp3OJr-0xwUzw

如果我解码这个 jwt，我会得到一个对象，其中一个属性是jwt ，值是我从 API 收到的令牌。

谁能告诉我

• 如果这是正确的格式并且
• 如何在对受限 api 端点的 fetch 调用中使用它？

目前我只是用这个选项做一个 fetch 调用

    method: 'GET',
    'cors': 'no-cors',
    credentials: 'same-origin'

但不幸的是，我得到的回应是

 [Symbol(Response internals)]: {
    url: 'https://localhost/countries',
    status: 401,
    statusText: 'Unauthorized',
    headers: Headers { [Symbol(map)]: [Object: null prototype] },
    counter: 0
  }

Answer 1

您需要检查您的 API 文档以了解它所期望的内容。 例如，您通常会将令牌附加到Authorization标头