pruthvidarji1993/web-secure-verification

# web-secure-verification [](https://www.npmjs.com/package/web-secure-verification) [](https://www.npmjs.com/package/web-secure-verification) [](https://opensource.org/licenses/MIT) [](https://nodejs.org) 一个用于 **React** 和 **Next.js** 项目的安全扫描 CLI。在任何项目的根目录下运行一条命令即可获取完整的安全报告。 ## 为什么不只使用 `npm audit`？ `npm audit` 仅检查依赖项树中已知的 CVE。`web-secure-verification` 还会扫描**你自己的应用程序代码**，以发现硬编码的密钥、危险的 DOM/eval 模式、Next.js hydration 错误、RSC 边界违规、暴露的 source map 以及许可证合规风险——这些都是 `npm audit` 从未检查过的问题。 ## 本软件包的功能 该软件包会扫描你的 React 或 Next.js 项目，并生成一份报告，准确告知你的代码和依赖项中存在哪些安全问题。它将运行 12 项不同的检查，涵盖： - **依赖项漏洞** — 已安装包（直接和间接依赖）中已知的 CVE - **过时的包** — 有更新、更安全版本的包 - **已弃用的包** — 作者已正式放弃维护的包 - **硬编码的密钥** — 遗留在源代码中的 API 密钥、token、私钥和高熵字符串 - **代码级安全** — 诸如 `eval()`、`innerHTML`、`dangerouslySetInnerHTML` 和命令注入等危险模式 - **Next.js 配置** — 缺失的安全标头、暴露的 `NEXT_PUBLIC_` 密钥、不安全的图片配置 - **许可证合规性** — 可能阻碍你的产品进行商业用途的 GPL/AGPL 许可证 - **供应链攻击** — 伪造拼写抢注的包名、已知的恶意包、`postinstall` shell 脚本 - **RSC 边界违规** — 跨越 Next.js 服务器/客户端边界的不可序列化 props - **React hydration 错误** — 在 `useEffect` 之外使用 `window`/`localStorage`，在 render 中使用 `new Date()` - **Bundle 大小问题** — 完整导入 `lodash` 或 `moment`，未进行懒加载的重组件 - **暴露的 source map** — public 目录中暴露你原始源代码的 `.map` 文件 ## 如何在你的项目中运行本软件包 ### 步骤 1 — 进入你的项目并 ``` npm i web-secure-verification ``` ### 步骤 2 — 运行扫描 ``` npx web-secure-verify scan ``` 你将在终端中看到一份带有颜色标记的报告，其中所有问题均按严重程度分组。 ## 输出示例 以下是在典型的 React / Next.js 项目上运行扫描后，你在终端中会看到的内容示例。 ``` Scanning project at: /Users/dev/projects/my-nextjs-app ╔══════════════════════════════════════════════════════════════════════════════╗ ║ 🔒 Web Secure Verification — Security Scan Report ║ ╚══════════════════════════════════════════════════════════════════════════════╝ Project: my-nextjs-app Path: /Users/dev/projects/my-nextjs-app Scanned: 5/12/2026, 10:30:00 AM Duration: 4.8s ──────────────────────────────────────────────────────────────────────────────── SUMMARY ──────────────────────────────────────────────────────────────────────────────── Critical High Medium Low Info 2 5 3 2 0 Total issues: 12 ──────────────────────────────────────────────────────────────────────────────── CRITICAL (2 issues) ──────────────────────────────────────────────────────────────────────────────── CRITICAL Use of eval() ID: code-security-eval-usage-src/utils/parser.ts-42 File: src/utils/parser.ts:42 Description: eval() executes arbitrary code and is a major security risk. It can execute malicious code if user input is passed to it. Fix: Replace eval() with safer alternatives like JSON.parse() for data, or refactor the logic. CRITICAL Hardcoded AWS Access Key ID: secrets-aws-access-key-src/config/aws.ts-8 File: src/config/aws.ts:8 Description: An AWS Access Key ID was found hardcoded in source code. This key can be used to access your AWS account and incur charges or expose data. Fix: Move this value to an environment variable and use process.env. Immediately rotate the key in your AWS Console. ──────────────────────────────────────────────────────────────────────────────── HIGH (5 issues) ──────────────────────────────────────────────────────────────────────────────── HIGH Outdated package: react ID: outdated-react Description: react is outdated. Current: 17.0.2, Wanted: 17.0.2, Latest: 19.1.0. This is a major version update. Fix: Run: npm install react@19.1.0 HIGH Outdated package: next ID: outdated-next Description: next is outdated. Current: 13.4.0, Wanted: 13.4.0, Latest: 15.3.2. This is a major version update. Fix: Run: npm install next@15.3.2 HIGH dangerouslySetInnerHTML usage ID: code-security-dangerous-inner-html-src/components/Blog.tsx-27 File: src/components/Blog.tsx:27 Description: dangerouslySetInnerHTML can introduce XSS vulnerabilities if the content is not properly sanitized. Fix: Sanitize HTML using DOMPurify before passing to dangerouslySetInnerHTML. HIGH Browser API accessed outside useEffect ID: hydration-browser-api-in-render-src/components/Sidebar.tsx-14 File: src/components/Sidebar.tsx:14 Description: Accessing window during render causes hydration mismatches because window does not exist on the server. Fix: Wrap browser API access in a useEffect hook. HIGH postinstall script in dependency: husky ID: supply-chain-postinstall-husky Description: The package "husky" runs a shell script on install: Script: node husky install Fix: Review the script contents and verify it is safe before proceeding. ──────────────────────────────────────────────────────────────────────────────── MEDIUM (3 issues) ──────────────────────────────────────────────────────────────────────────────── MEDIUM Outdated package: axios ID: outdated-axios Description: axios is outdated. Current: 0.27.2, Wanted: 0.27.2, Latest: 1.7.2. This is a major version update. Fix: Run: npm install axios@1.7.2 MEDIUM new Date() used in render — potential hydration mismatch ID: hydration-new-date-in-render-src/components/Footer.tsx-31 File: src/components/Footer.tsx:31 Description: Calling new Date() during render returns different timestamps on the server and client, causing React hydration errors. Fix: Move new Date() inside a useEffect hook. MEDIUM Non-standard license: some-package (UNLICENSED) ID: license-some-package-UNLICENSED Description: The package "some-package" has no declared license. You cannot legally use it without permission from the author. Fix: Contact the package author or replace with a licensed alternative. ──────────────────────────────────────────────────────────────────────────────── LOW (2 issues) ──────────────────────────────────────────────────────────────────────────────── LOW Hardcoded HTTP URL ID: code-security-http-hardcoded-url-src/api/client.ts-5 File: src/api/client.ts:5 Description: A hardcoded HTTP URL was found. HTTP traffic is unencrypted and can be intercepted. Fix: Replace http:// with https:// for all external URLs. LOW heavy component not lazy-loaded: recharts ID: bundle-heavy-import-src/pages/dashboard.tsx-3 File: src/pages/dashboard.tsx:3 Description: recharts is imported directly and will be included in the initial JavaScript bundle, slowing down page load. Fix: Use React.lazy() or Next.js dynamic() to load it only when needed. ──────────────────────────────────────────────────────────────────────────────── SCANNER DETAILS ──────────────────────────────────────────────────────────────────────────────── ✓ CLEAN npm-audit (820ms) ✗ 2 issues outdated (1.2s) ✓ CLEAN deprecated (1.6s) ✗ 1 issue secrets (45ms) ✗ 2 issues code-security (18ms) ✓ CLEAN nextjs (3ms) ✗ 1 issue license (2ms) ✗ 1 issue supply-chain (1ms) ✓ CLEAN rsc-boundary (12ms) ✗ 2 issues hydration (10ms) ✗ 1 issue bundle (14ms) ✓ CLEAN source-maps (4ms) ════════════════════════════════════════════════════════════════════════════════ ✗ SCAN FAILED — Critical or high severity issues found 2 critical, 5 high severity issues must be addressed ════════════════════════════════════════════════════════════════════════════════ ``` ### 当你的项目通过扫描时 ``` ──────────────────────────────────────────────────────────────────────────────── SCANNER DETAILS ──────────────────────────────────────────────────────────────────────────────── ✓ CLEAN npm-audit (612ms) ✓ CLEAN outdated (980ms) ✓ CLEAN deprecated (1.4s) ✓ CLEAN secrets (21ms) ✓ CLEAN code-security (13ms) ✓ CLEAN nextjs (2ms) ✓ CLEAN license (1ms) ✓ CLEAN supply-chain (0ms) ✓ CLEAN rsc-boundary (0ms) ✓ CLEAN hydration (8ms) ✓ CLEAN bundle (11ms) ✓ CLEAN source-maps (3ms) ════════════════════════════════════════════════════════════════════════════════ ✓ SCAN PASSED — No critical or high severity issues found ════════════════════════════════════════════════════════════════════════════════ ``` 每个问题都会告诉你： - **严重程度** — Critical / High / Medium / Low - **问题是什么** — 对该问题的通俗描述 - **问题位置** — 确切的文件和行号 - **如何修复** — 你现在就可以采取的具体操作 ## 将报告保存到文件 ``` # HTML 文件 — 在任意浏览器中打开 npx web-secure-verify scan --format html --output report.html # JSON 文件 — 用于脚本或 dashboards npx web-secure-verify scan --format json --output report.json # Markdown — 粘贴到 GitHub PR 评论中 npx web-secure-verify scan --format markdown --output report.md # SARIF — 上传至 GitHub Code Scanning npx web-secure-verify scan --format sarif --output results.sarif ``` ## 实用选项 ``` # 扫描特定文件夹（非当前目录） npx web-secure-verify scan --path ./my-app # 仅显示 high 和 critical 问题 npx web-secure-verify scan --severity high # 跳过特定检查 npx web-secure-verify scan --skip outdated,license,bundle # 扫描后以交互方式 Auto-fix 问题 npx web-secure-verify scan --fix # 查看所有可用的 scanners npx web-secure-verify list-scanners ``` ## 全局安装（可选） 如果你想在不使用 `npx` 的情况下经常使用该工具： ``` npm install -g web-secure-verification web-secure-verify scan ``` ## 环境要求 - Node.js 18 或更高版本 - 已安装 npm - 该项目必须包含 `package.json` 并且存在 `node_modules/` ## 作者 **Pruthvi Darji** ## 许可证 MIT

标签：MITM代理, React, Syscalls, 安全扫描, 时序注入, 暗色界面, 自动化攻击, 错误基检测, 静态代码分析