Question

伙计们，

我正在开发一个具有Web API（RestAPI）和SPA（单页应用程序）解决方案的项目。

根据我在Udemy上观看的视频，他将jwt令牌存储在本地存储中，但后来我发现在本地存储中存储存在一定风险，因为攻击者可以在将来复制实际的令牌并提出请求

我读过一些博客，因为可以将cookie设置为httpOnly并且安全，因此可以在cookie中存储令牌是可以的。但是问题是，我不知道如何实现。

这是我具有有效登录名的示例代码：

axios.post('api/login/', this.account).then(response=>{
    if(response){
        localStorage.setItem('token', response.data.token); // will successfully save to localstorage
        // navigation here
    }
}).catch(error=> console.log(error); );

如何使用安全设置将其存储在Cookie中？

Answer 1

这类似于：Set a cookie to HttpOnly via Javascript

要添加到答案this source的引号中：

为防止跨站点脚本（XSS）攻击，HttpOnly cookie是 JavaScript的Document.cookie API无法访问

为了使用httpOnly和secure标志保存令牌，服务器将必须在标头中对此进行响应（再次取自上述来源）：

Set-Cookie：id = a3fWa; Expires = Wed，2015年10月21日格林威治标准时间；安全; HttpOnly

因此，如果服务器未使用Set-Cookie标头响应，而是将令牌作为响应主体返回，我认为您不能安全地保存cookie。

Answer 2

您无法通过客户端代码（如Javascript）设置HttpOnly cookie。因此，不得使用Javascript读取Cookie。您必须从服务器设置此类cookie。您可以发送带有服务器响应的cookie，浏览器会将它们存储在标题中。之后，浏览器将把该cookie发送到服务器，并将每个请求发送到服务器，直到cookie过期。

您可以按照以下步骤从服务器设置cookie。

Cookie cookie = new Cookie(name, value); //name and value of the cookie
cookie.setMaxAge(expire); //expire could be 60 (seconds)
cookie.setHttpOnly(true);
cookie.setPath("/");
response.addCookie(cookie);

Answer 3

我读过一些博客，因为在令牌中存储令牌是可以的，因为您可以将Cookie设置为httpOnly并且安全。但是问题是，我不知道如何实现。

您需要在服务器上实现此功能，而不是在客户端上实现。

以下是登录端点的服务器代码的示例：

// If the passwords match, generate a new jwt for this user
const token = user.generateAuthToken();

// Set the options for the cookie
let cookieOptions = {
    // Delete the cookie after 90 days
    expires: new Date(Date.now() + 90 * 24 * 60 * 60 * 1000 ),
    // Set the cookie's HttpOnly flag to ensure the cookie is 
    // not accessible through JS, making it immune to XSS attacks  
    httpOnly: true,
};
// In production, set the cookie's Secure flag 
// to ensure the cookie is only sent over HTTPS
if( process.env.NODE_ENV === 'production') {
    cookieOptions.secure = true;
}

// Send a success response to the client
// including the jwt in a cookie
return res
    .cookie('jwt', token, cookieOptions)
    .status(200)
    .json({
        msg: 'Successfully logged in',
    });
}

使用Http和Secure将Jwt令牌存储在Cookie中，而不是使用Javascript存储Localwt

3 个答案: