Archify icon

Archify

Archify 是一款 Chrome 浏览器扩展,可在实时网页中发现组件、API、库及其他运行时信号。适合前端工程师、QA 工程师和技术创始人,无需离开浏览器即可了解应用如何工作。

Archify

概述

Archify 是一款用于从外部理解 Web 应用如何构建的浏览器扩展。它不关注源代码,而是检查实时页面,在浏览器中直接揭示组件、API、库、托管线索以及其他运行时信号。

该产品面向需要在不离开当前检查页面的情况下快速追踪行为的开发者。它强调本地分析、有证据支撑的结果,以及保守输出:当某个细节无法验证时,Archify 会显示 unknown,而不是编造结果。

Archify 的功能

元素级和整页检查

悬停在某个元素上,或点击工具栏图标查看整页。Archify 会识别技术栈、主机、跟踪器和附近脚本,并将它们关联回所选元素。

本地运行时分析

该产品会读取运行时信号,例如框架内部信息、网络调用、DOM 和表单字段监听器。页面说明这一切都在浏览器本地完成。

带置信度分数的结果

检测到的项目会显示置信度分数和证据。即使 Archify 无法验证某项内容,也会显示 unknown,而不是猜测。

广泛的技术检测

首页列出了跨框架和运行时、UI 库和样式系统、分析和像素、电商平台、CMS、托管服务、认证工具以及防护措施的检测覆盖范围。

敏感字段可见性

Archify 可以展示哪些内容会接触敏感字段,包括哪些第三方脚本会监听表单和支付输入,以及涉及哪些外部域名。

请求与状态追踪

该工作流强调将可见的 UI 操作追踪到其影响的组件、API 调用、存储条目和路由。

Archify 的常见用法

  • 调试前端问题

    将 UI 症状追溯到可能导致问题的组件、API 调用以及存储或路由变更。当可见的 bug 并不明显指向其来源时,这很有用。

  • 审查客户端暴露面

    检查结账、登录或表单流程,查看哪些脚本会监听敏感字段,以及涉及哪些外部域名或第三方服务。

  • 研究外部应用

    在不打开代码库的情况下,查看一个公开站点似乎使用了什么技术栈、托管、分析和 UI 框架。这有助于竞品研究和技术尽职调查。

  • 为 QA 报告补充技术细节

    为 bug 报告附上组件、请求和状态上下文,让 QA 提供比单独截图更有可操作性的说明。

  • 快速获取架构概览

    当你想快速理解一个应用,而不想切换到 source maps、多个 DevTools 面板或单独的审计工具时,可以直接用浏览器本身作为检查界面。

Pros and Cons

Pros

  • 完全在浏览器本地运行,无需账号。
  • 表层检查设计得很快:悬停元素或使用工具栏图标即可检查页面。
  • 将应用的多个层面同时展示出来,包括组件、API、存储、路由和附近脚本。
  • 附带置信度分数和证据,因此结果不会被当作猜测呈现。
  • 覆盖范围广泛,包括框架、UI 库、分析工具、电商平台、CMS、托管、认证和防护。

Cons

  • 网站说明,只有开发构建才会提供精确的组件名称;压缩后的生产代码可能只能得到组件类型和置信度分数。
  • 它不能在浏览器内部页面上运行,例如 chrome:// 或扩展商店。
  • 首页将其定位为 DevTools 的补充,而不是完全替代品。

FAQ

Archify 是免费的吗?

是。首页说明 Archify 免费并且开源,采用 Apache-2.0 许可证,无需账号、付费墙或试用。

数据会离开浏览器吗?

不会。产品说明分析完全在浏览器本地运行,不经过服务器、遥测或分析,并且不会存储或传输页面内容。

它可以检测哪些框架和组件?

它可以检测 React、Next.js、Vue、Angular 和 Svelte 等框架,以及许多其他技术。对于精确的组件名称,网站注明开发构建能提供最详细的信息,而压缩后的生产代码可能只显示组件类型和置信度分数,而不是编造名称。

它能在任何网站上使用吗?

它适用于你选择检查的任何网页,但由于浏览器策略,它不能运行在浏览器内部页面上,例如 chrome:// 页面或扩展商店。

它是 DevTools 的替代品吗?

不能。网站说明 Archify 展示的是架构和运行时关系,而 DevTools 展示的是实现细节。二者被定位为互补,而不是互相替代。

Quick Facts

类别
开发者工具
产品类型
浏览器扩展
平台
Chrome
主要用户
前端工程师、QA 工程师、技术创始人
来源域名
archify.salahxd.dev
定价
免费并且基于 Apache-2.0 开源