HTML Form 可以把 POST 响应加载进 iframe
在接入支付验证、身份认证或第三方授权页面时，我们经常会遇到这样的流程： 1. 后端返回一个第三方接口地址。 2. 这个地址必须通过 请求访问。 3. 接口返回 HTML，或者重定向到真正的验证页面。 4. 验证页面需要嵌入当前网站，而不是打开新标签页。 5. 验证完成后，当前页面继续执行后续业务。 第一次遇到这个需求，很容易想到： 但涉及第三方支付时，这种方式通常会遇到 CORS、Cookie、重定向和跨域页面读取限制。 实际上，HTM...
前端判断一个网页是否允许被 iframe 内嵌
前端 不能 100% 准确提前判断 一个网页是否允许被 iframe 内嵌，因为决定权主要在目标网站返回的 HTTP 响应头 里，而普通前端 JS 通常读不到跨域页面的响应头。 核心判断看这两个东西： 1. 老一点但仍常见。 表示完全不允许被 iframe 嵌入。 表示只允许同源页面 iframe 嵌入。 以前有这个，但现代浏览器支持很差，基本不建议依赖。 2. 现在更推荐看这个。 表示不允许任何页面嵌入。 表示只允许同源嵌入。 表示只...
网页唤起 Android App 调试笔记（App Links）
在最近的项目中，我遇到了 网页访问特定 URL 应该唤起 Android App，但实际只打开网页 的问题。通过调试和排查，整理出以下经验和步骤。 1\. 项目与环境信息（脱敏处理） 网站域名： 唤起页面： Android App 包名： intent filter 配置示例： assetlinks.json 已上线，包含 App 的 SHA256 签名指纹 2\. 问题现象 用户访问 页面时， 网页打开了，但 App 没...
深入理解 Cookie：安全属性、访问边界与渲染场景实践
本文系统梳理 Cookie 核心机制，聚焦 HttpOnly/SameSite 等安全属性 、 访问权限边界 、 CSR/SSR 差异 ，附关键代码示例与安全清单。适合开发查阅与知识沉淀。 一、Cookie 是什么？为什么需要它？ HTTP 是无状态协议。Cookie 是服务端通过 响应头下发、浏览器自动存储并在后续 同源请求中携带 的小型文本数据（通常 ≤4KB），用于： 会话维持（Session ID） 用户偏好（语言/主题） 跨请...
退出登录时 Cookie 清除指南
核心结论 ：登出 ≠ 单方面操作。HttpOnly 与非 HttpOnly Cookie 需 前后端协同清除 ，缺一不可。残留 Cookie = 安全隐患 + 用户体验漏洞。 🔒 为什么不能“一键清空”？ 浏览器出于安全设计： 后端 ：只能通过 响应头清除 自己设置过 的 Cookie（需属性完全匹配） 前端 JS ：可读写非 HttpOnly Cookie，但 无法触碰 HttpOnly Cookie 无“清除全部”API ：任何服...
懒加载图片在同一个 Item 中逐个出现的原因与解决方案
懒加载图片在同一个 Item 中逐个出现的原因与解决方案 适用场景 ：使用原生 实现图片懒加载的动态列表，每个列表项（item）包含多张图片。 📌 问题描述 在开发一个动态渲染的列表时，每个 item 中包含三张图片，并使用 HTML 原生的懒加载属性： 观察到的现象： 开启懒加载时 ：三张图片 不是同时出现 ，而是 从左到右（或从上到下）依次加载显示 ，有明显的时间差。 关闭懒加载（移除 ）后 ：三张图片 看起来是一起出现的 ，视觉...
📌 Vue Skeletor 要点
用途 ：提供自适应的骨架屏加载组件，自动匹配现有组件的排版和样式，无需手动绘制方块或圆形。 安装 ： 使用方式 ： 局部注册 ：在组件中 并注册。 全局注册 ：在 中 。 插件模式 ：可通过 全局配置，关闭闪烁动画。 提供 组合式 API，可在运行时修改全局配置。 属性支持 ： / ：支持数值或 CSS 字符串。设置 时骨架变为矩形。 ：同时设置宽高，方便生成方形或圆形。 ：布尔值，生成圆形骨架。 ：布尔值，生成圆角矩形，适合按钮或芯片...
SVGA动画格式详解
一、什么是 SVGA？ SVGA（Scalable Vector Graphics Animation） 是一种专为移动端设计的 轻量级动画文件格式 ，由中国的 YY 语音团队（现欢聚集团） 在早期移动端直播应用中开发。 它的目标是： 在移动设备上实现接近 AE（After Effects） 动画的效果，同时具备极小的文件体积与极高的渲染性能。 与常见的 GIF、Lottie（JSON） 相比，SVGA 主要用于 直播、互动类动画特效...
Hook 的设计意义与实践
🧩 一、Hook 的本质是什么？ Hook 是一种可复用逻辑的抽象方式。 它的核心思想是： 把「逻辑」从「组件渲染结构」中抽离出来，使逻辑能被复用、独立测试、灵活组合。 示例 组件中使用： ✅ 组件不再关心逻辑的实现，只关心如何展示。 ⚙️ 二、为什么要设计 Hook？ 1️⃣ 逻辑复用 传统做法（如 mixin）的问题： 数据来源不清晰（变量名可能冲突） 生命周期混乱（难以追踪依赖） 不利于类型推导 Hook 则通过 函数闭包 +...