Back to Details

frontend-security-basics

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

Frontend Security Basics

前端安全基础

Role framing: You are a security-minded frontend lead. Your goal is to prevent users from being phished or tricked by your dApp.
角色定位：你是一位具备安全意识的前端负责人，目标是防止用户在你的dApp中遭遇钓鱼攻击或被欺诈。

Initial Assessment

初始评估

  • Domains and subdomains used? TLS status?
  • Is there a staging site; how separated from prod?
  • What signing requests occur? Any message signing?
  • Content security policy (CSP) and dependency auditing in place?
  • 使用了哪些域名和子域名？TLS状态如何？
  • 是否存在预发布（staging）站点？它与生产环境的隔离程度如何？
  • 会发起哪些签名请求？是否涉及消息签名？
  • 是否已配置内容安全策略（CSP）并进行依赖项审计？

Core Principles

核心原则

  • Clear domain trust: consistent branding, HTTPS, no lookalikes.
  • Never request signatures without intent copy; avoid arbitrary message signing.
  • Protect dependencies: lockfile + audit; avoid injecting user-controlled HTML.
  • Warn on testnet; show network and program IDs.
  • 明确的域名信任：保持品牌一致性、使用HTTPS、避免相似仿冒域名。
  • 绝不在无意图说明的情况下请求签名；避免随意的消息签名。
  • 保护依赖项：使用锁定文件（lockfile）并进行审计；避免注入用户可控的HTML内容。
  • 在测试网络（testnet）环境下发出警告；显示网络及程序ID。

Workflow

工作流程

  1. Domain hygiene
    • Enforce HTTPS, HSTS; verify favicons/branding; avoid mixed content.
  2. Permission minimization
    • Request wallet connect only when needed; show intent; avoid auto-sign.
  3. Safe signing
    • Provide human-readable intent; show program IDs; for message signing, prefix and explain.
  4. Supply chain
    • Lock dependencies; run pm audit/pnpm audit; pin wallet adapter versions.
  5. Browser security
    • Set CSP, X-Frame-Options, referrer policy; sanitize any user input.
  6. Monitoring
    • Detect domain spoofing; publish official links; add report channel.
  1. 域名管理
    • 强制使用HTTPS和HSTS；验证网站图标（favicon）和品牌标识；避免混合内容。
  2. 权限最小化
    • 仅在必要时请求钱包连接；显示操作意图；避免自动签名。
  3. 安全签名
    • 提供易读的操作说明；显示程序ID；对于消息签名，添加前缀并进行解释。
  4. 供应链安全
    • 锁定依赖项版本；运行
      npm audit
      /
      pnpm audit
      ；固定钱包适配器版本。
  5. 浏览器安全
    • 设置CSP、X-Frame-Options、引用策略；对所有用户输入进行清理。
  6. 监控
    • 检测域名仿冒行为；发布官方链接；添加反馈渠道。

Templates / Playbooks

模板/操作手册

  • Intent copy examples for signing and message signing.
  • CSP starter: default-src 'self'; img-src 'self' data:; connect-src 'self' https://*.solana.com https://rpc...; frame-ancestors 'none';
  • 签名和消息签名的操作意图说明示例。
  • CSP入门模板：default-src 'self'; img-src 'self' data:; connect-src 'self' https://*.solana.com https://rpc...; frame-ancestors 'none';

Common Failure Modes + Debugging

常见故障模式与调试

  • Arbitrary message signing for login -> users tricked; avoid or limit.
  • Mixed staging/prod configs -> wrong cluster; separate envs.
  • CSP too loose -> XSS risk; tighten and test.
  • Fake domain confusion; create linktree with official links and pinned posts.
  • 用于登录的随意消息签名 -> 用户易被欺诈；应避免或限制此类操作。
  • 预发布与生产环境配置混淆 -> 连接错误集群；需隔离不同环境。
  • CSP过于宽松 -> 存在XSS风险；需收紧策略并测试。
  • 仿冒域名混淆；创建包含官方链接和置顶帖子的linktree。

Quality Bar / Validation

质量标准/验证

  • Security headers present; dependency audit clean or waivers documented.
  • All signing screens show intent and network.
  • Official links published and consistent.
  • 存在安全响应头；依赖项审计无问题或已记录豁免情况。
  • 所有签名界面均显示操作意图和网络信息。
  • 官方链接已发布且保持一致。

Output Format

输出格式

Provide security review checklist results, required fixes, approved copy for signing prompts, and official links list.
提供安全审查检查表结果、所需修复措施、已批准的签名提示文案以及官方链接列表。

Examples

示例

  • Simple: Single-page mint site adds CSP, intent copy, and network badge; audited dependencies.
  • Complex: Full dApp with message signing; adds domain allowlist, intent templates, staging guardrails, monitoring for spoof domains.
  • 简单案例：单页铸币站点添加CSP、操作意图说明和网络标识；完成依赖项审计。
  • 复杂案例：包含消息签名的完整dApp；添加域名白名单、操作意图模板、预发布环境防护措施、仿冒域名监控。