前端无感刷新Token

  在现代 Web 应用中,身份验证(Authentication)权限控制(Authorization)是保障安全的核心机制。通常,前端登录成功后会拿到一个 access_token(访问令牌)用于后续请求。但为了安全,这个 access_token 的有效期往往较短,比如 15 分钟或 1 小时。如果不做处理,Token 过期后用户就需要重新登录,这会导致用户体验变差。为了解决这个问题,我们引入了“无感刷新 Token”机制,即在不打断用户操作的前提下,悄悄完成 Token 的续期,让经常使用的用户察觉不到 Token 的生命周期。

阅读更多

HttpOnly Cookie 全解析

  在前端开发中,我们经常与 Cookie 打交道。它是浏览器最原始的数据持久化方案,被广泛用于记录登录状态、用户偏好等信息。然而,Cookie 也是 XSS 攻击的高发地带,尤其是当我们把敏感信息(如 Token)直接暴露在 document.cookie 中时,风险极高。为了解决这一问题,浏览器支持了一个重要的 Cookie 属性:HttpOnly。它是保障 Web 安全的重要方法,很多前后端分离项目在实现登录、权限控制时,都会用到。

阅读更多

前端鉴权机制

  在现代 Web 开发中,身份验证会话管理是不可或缺的组成部分。HTTP是无状态的协议,为了在用户与服务器之间维持状态,前端和后端需要协同使用一些机制来标识用户身份并保障数据安全。本文将围绕 Cookie、Session、Token、JWT 四种常见方式进行介绍与对比,并结合实际说明 Cookie 在前端的基本操作方法。

阅读更多

无缝滚动动画

  今天看到 icomoon 的顶部的无缝滚动动画感觉蛮有意思的,在 Web 开发中,无缝滚动动画是一种常见的视觉效果,通常用于展示新闻、品牌 Logo 或者图标动画等。本文将使用 HTML 和 CSS 实现该站点的无缝滚动的动画效果。

阅读更多