static-to-api-layer — independently scanned and version-tracked by SaferSkills.
SaferSkills independently audited static-to-api-layer (Agent Skill) and scored it 100/100 (green). The audit ran 55 deterministic rules across Security, Supply Chain, Maintenance, Transparency, and Community; it found 0 high-severity and 0 lower-severity findings. The full rule-by-rule trace and per-finding evidence are below. Free, methodology-open.
Findings & checks · 0 flagged
Every scanned point with the score it earned and what moved between them.
First recorded scan — no prior version to compare against.
The primary manifest — the file an agent reads to learn what this artifact does.
从静态前端页面出发，聚焦 发现隐式接口需求 → 页面 API 化改造 → 统一请求层 → 切换层预留。
mock.js / 页面 data / useState / constants 中api-extractor-pro 的前置工程化改造支持框架：React / Vue / 微信小程序
本 skill 只做页面和调用层改造，不生成接口治理产物：
wx.request 拦截式 Mock 方案contract.json、openapi.yaml、接口文档、一致性报告接口治理产物（contract/OpenAPI/文档/校验）统一由api-extractor-pro生成。 小程序 Mock 数据由本 skill 的mock-interceptor-wx.js模板提供，因 MSW 在小程序中不可用。
┌────────────┐ ┌────────────┐ ┌────────────┐ ┌────────────┐
│1. Discover │───▶│2. Refactor │───▶│3. API Layer│───▶│4. Switch │
│隐式接口发现 │ │页面改造 │ │统一请求封装 │ │切换层预留 │
└────────────┘ └────────────┘ └────────────┘ └────────────┘收到用户请求后，按以下步骤启动：
package.json 含 react，目录结构含 src/components / src/pagespackage.json 含 vue，目录结构含 src/views / src/componentsapp.json + project.config.json，页面为 .wxml + .wxss + .js目标：扫描项目中所有页面和数据文件，识别隐式数据接口需求
#### 1.1 需要识别的 7 类接口模式
| # | 接口模式 | 识别特征 | 转化目标 |
|---|---|---|---|
| 1 | 列表查询 | 硬编码数组 const LIST = [...]，页面 data 中直接赋值列表 | GET /api/xxx/list |
| 2 | 详情查询 | getXxxById(id)、find(x => x.id === id)、URL 参数取 id | GET /api/xxx/:id |
| 3 | 条件筛选 | .filter()、selectedCategory、条件分支渲染 | GET /api/xxx/list?key=value |
| 4 | 分页加载 | .slice(0, n)、loadMore、page/pageSize 变量 | GET /api/xxx/list?page=1&pageSize=10 |
| 5 | 表单提交 | handleSubmit() 仅有 Toast/alert 无真实请求 | POST /api/xxx |
| 6 | 状态变更 | handleApprove()/handleReject()/handleDelete() 等操作 | PUT /api/xxx/:id/action |
| 7 | 聚合统计 | STATS_* 统计数据、图表数据源 | GET /api/stats/xxx |
#### 1.2 各框架识别特征
| 特征 | React | Vue | 微信小程序 |
|---|---|---|---|
| 数据声明 | useState([...]) / const data = [...] | data() { return { list: [...] } } | Page({ data: { list: [...] } }) |
| 数据加载 | useEffect(() => {...}, []) | mounted() / onMounted() | onLoad() / onShow() |
| 表单提交 | onSubmit / handleSubmit | @submit / methods.submit | bindsubmit / handleSubmit |
| 无效请求标志 | alert('成功') / console.log | ElMessage.success / this.$message | wx.showToast({ title: '成功' }) |
| 数据文件 | mock.js / data.ts / constants.ts | mock.js / data.js | mock.js / 页面 js 内硬编码 |
#### 1.3 附加检测
GET /api/config/xxxwx.chooseImage、<input type="file"> → POST /api/uploadGET /api/user/profile / POST /api/auth/login#### 1.4 输出
生成 discovery_report.md（参考 templates/discovery-report.md），包含：
目标：将页面中的硬编码数据源替换为 API 调用
#### 2.1 页面改造规则
require('...mock') / import ... from '../mock'）[] / null / {}）onLoad / useEffect / mounted）catch → 错误提示 Toast）目标：生成统一请求基础层 + 模块 API 文件
#### 3.1 产物结构
api/ （或 src/api/）
├── request.js ← 请求封装基础层（含 Mock 切换）
├── resource.js ← 资源模块 API
├── audit.js ← 审核模块 API
├── stats.js ← 统计模块 API
└── config.js ← 配置 API#### 3.2 请求封装模板
templates/request-wx.jstemplates/request-axios.jstemplates/request-fetch.js目标：预留一键切换机制，后续联调时无需改动页面代码
#### 4.1 切换架构
页面代码（不改动）
↓ 调用
api/resource.js（不改动）
↓ 调用
api/request.js（改这里）
↓ 根据配置
┌────────────────┐
│ IS_MOCK=true │──→ 项目现有 Mock 方案
│ IS_MOCK=false │──→ 真实 HTTP 请求
└────────────────┘#### 4.2 request.js 中的切换点
微信小程序：
const config = {
IS_MOCK: true,
baseURL: '',
}React/Vue：
const IS_MOCK = import.meta.env.VITE_API_MODE === 'mock'| 产物 | 路径 | 说明 |
|---|---|---|
| 数据发现报告 | discovery_report.md | 隐式接口需求分析结果 |
| 请求封装 | api/request.js | 统一请求层，含 Mock 切换 |
| API 模块 | api/[module].js | 按模块分组的 API 函数 |
| 改造后页面 | 原页面文件 | 替换为 API 调用 |
1) static-to-api-layer
- 完成页面 API 化改造
- 不生成 contract/mock/docs
2) api-extractor-pro
- 从改造后的 API 调用中扫描并生成 contract
- 统一生成 Mock、OpenAPI、文档、校验和变更报告getList / getById / create / update / delete）x-todo-confirmtemplates/request-wx.jstemplates/request-axios.jstemplates/request-fetch.jstemplates/mock-interceptor-wx.jstemplates/discovery-report.mdexamples/before-after.md~30 seconds. Free. No account. Every finding cites a rule and a line of evidence.