技能 building-nextjs-apps
📦
building-nextjs-apps
内容修订 r2 高风险 ⚙️ 外部命令🌐 网络访问🔑 环境变量
正确构建 Next.js 16 应用
Next.js 16 改变了路由、params、proxy 文件和缓存模式。此技能为 Claude、Codex 和 Claude Code 提供聚焦指导，帮助正确实现。
支持: Claude Codex Code(CC)
安装前请停下并请求确认。
请审查安装计划，并在更改文件前获得用户明确同意。
使用我的智能体安装
将此请求复制给你的智能体，其中包含权威 Skill 页面和清单。
智能体请求
Review the Skillstore skill "building-nextjs-apps" from https://skillstore.io/skills/asmayaseen-building-nextjs-apps.md and its manifest at https://skillstore.io/api/skills/asmayaseen-building-nextjs-apps/manifest. Verify the artifact. Stop and obtain explicit user consent before installing or changing files.你的智能体仍应展示其计划，并按安全策略请求必要确认。
Agent 可读资源
当 AI Agent、爬虫或脚本需要干净上下文，而不是读取完整页面时，请使用这些链接。
测试它
正在使用“building-nextjs-apps”。 一个要求构建包含任务详情页的 dashboard 的请求。
预期结果:
一个 Next.js 16 结构，包含 async dynamic routes、服务端数据加载、API route 指导和 UI 组合说明。
正在使用“building-nextjs-apps”。 一个仍在使用 middleware.ts 和同步 params 的项目。
预期结果:
一个迁移计划，将 middleware 重命名为 proxy，await route props，并更新受影响的 handlers 和 metadata。
正在使用“building-nextjs-apps”。 一个使用 datetime-local 值处理任务截止时间的表单。
预期结果:
一种 UTC 存储和本地显示方法，可防止 browser、API 和 database 层之间出现时区偏移。
安全审计
高风险v9 • 2026/7/23 打开版本化报告
Most static findings are false positives caused by Markdown backticks, JavaScript template literals, documented fetch calls, configuration access, and benign route parameters. Two unpinned npx command ranges create medium supply-chain risk. Semantic review also found a high-severity example that returns an HttpOnly session token in a response header.
5
已扫描文件
1,309
分析行数
2
复核项
0
已忽略误报
已确认安全问题 (1)
高
HttpOnly session token exposed in response header
The proxy example copies the session cookie value into the x-user-token response header. This exposes the HttpOnly token to clients and defeats its confidentiality protection.
The example directly reads the session cookie and sets its value on a NextResponse header. The documented behavior is explicit and reproducible.
能力复核项 (2)
这些是真实的本地能力，对此技能可能是预期行为，因此需要复核，但不会按已确认恶意行为计分。
中
Ruby/shell backtick execution
```bash
This range instructs users to run npx packages tagged @latest for project setup. The commands are legitimate, but unpinned registry execution creates a supply-chain risk.
中
Ruby/shell backtick execution
```bash
This range installs and runs next-devtools-mcp@latest through npx. Executing an unpinned third-party package and granting it MCP access creates a supply-chain risk.
风险因素
⚙️ 外部命令 (50)
references/datetime-patterns.md:81-83 references/nextjs-16-patterns.md:344-371 references/nextjs-16-patterns.md:425-449 references/nextjs-16-patterns.md:467-482 references/nextjs-16-patterns.md:536-556 references/nextjs-16-patterns.md:556-567 references/nextjs-16-patterns.md:608-615 SKILL.md:20-35 SKILL.md:35-39 SKILL.md:39-51 SKILL.md:51-55 SKILL.md:55-64 SKILL.md:64-72 SKILL.md:72-79 SKILL.md:79-83 SKILL.md:83-98 SKILL.md:98-102 SKILL.md:102-118 SKILL.md:118-122 SKILL.md:122-141 SKILL.md:141-145 SKILL.md:145-159 SKILL.md:159-163 SKILL.md:163-178 SKILL.md:178-186 SKILL.md:186-200 SKILL.md:200-204 SKILL.md:204-223 SKILL.md:223-229 SKILL.md:229-247 SKILL.md:247-257 SKILL.md:257-259 SKILL.md:259-261 SKILL.md:261-263 SKILL.md:263-273 SKILL.md:273-279 SKILL.md:279-280 SKILL.md:280-281 SKILL.md:281-282 SKILL.md:282-283 SKILL.md:283-284 SKILL.md:284-285 SKILL.md:285-291 SKILL.md:291-294 SKILL.md:294-298 SKILL.md:298-301 SKILL.md:301-305 SKILL.md:305-308 SKILL.md:308-312 SKILL.md:312-315
🌐 网络访问 (13)
references/nextjs-16-patterns.md:341 references/nextjs-16-patterns.md:425 references/nextjs-16-patterns.md:466 references/nextjs-16-patterns.md:536 references/nextjs-16-patterns.md:556 references/nextjs-16-patterns.md:313 references/nextjs-16-patterns.md:395 references/nextjs-16-patterns.md:700 references/nextjs-16-patterns.md:704 SKILL.md:189 SKILL.md:209 SKILL.md:189 SKILL.md:319
🔑 环境变量 (14)
references/nextjs-16-patterns.md:313 references/nextjs-16-patterns.md:425 references/nextjs-16-patterns.md:467 references/nextjs-16-patterns.md:536 references/nextjs-16-patterns.md:556 references/nextjs-16-patterns.md:590 references/nextjs-16-patterns.md:608 references/nextjs-16-patterns.md:313 references/nextjs-16-patterns.md:425 references/nextjs-16-patterns.md:467 references/nextjs-16-patterns.md:536 references/nextjs-16-patterns.md:556 references/nextjs-16-patterns.md:590 references/nextjs-16-patterns.md:608
审计者: codex 查看审计历史 →
分享与引用此报告
分享版本化评估报告、中性徽章、嵌入卡片和引用。Skillstore 只报告证据，不判断该 Skill 是否安全。
复制报告链接
https://skillstore.io/skills/asmayaseen-building-nextjs-apps/audits/9?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_reportMarkdown 徽章
[](https://skillstore.io/skills/asmayaseen-building-nextjs-apps?utm_source=security_passport_badge)HTML 徽章
<a href="https://skillstore.io/skills/asmayaseen-building-nextjs-apps?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/asmayaseen-building-nextjs-apps/security.svg" alt="Skillstore security assessment" loading="lazy"></a>嵌入卡片
<iframe src="https://skillstore.io/embed/skills/asmayaseen-building-nextjs-apps.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>学术引用 (APA · BibTeX · CFF)
APA 引用
Asmayaseen. (2026). building-nextjs-apps security audit report (audit version 9) [Author version unspecified]. Skillstore. https://skillstore.io/skills/asmayaseen-building-nextjs-apps/audits/9BibTeX 引用
@techreport{asmayaseen-asmayaseen-building-nextjs-apps-2026,
author = {Asmayaseen},
title = {building-nextjs-apps security audit report (audit version 9)},
institution = {Skillstore},
year = {2026},
number = {9},
url = {https://skillstore.io/skills/asmayaseen-building-nextjs-apps/audits/9},
note = {Author version unspecified}
}CITATION.cff
cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "building-nextjs-apps security audit report (audit version 9)"
version: "unspecified"
type: report
authors:
- name: "Asmayaseen"
date-released: "2026-07-23"
url: "https://skillstore.io/skills/asmayaseen-building-nextjs-apps/audits/9"
identifiers:
- type: other
value: "skillstore:asmayaseen-building-nextjs-apps:audit:9"
description: "Skillstore immutable audit report identifier"
Skillstore 评分
评分依据 证据置信度: 中 68
架构
85
可维护性
87
内容
73
社区
91
规范符合性
你能构建什么
创建新的 Next.js 16 应用
生成一个包含 TypeScript、正确路由模式和现代前端结构的 App Router 项目。
升级 Next.js 15 项目
更新 async route props、proxy 文件、Turbopack 设置、缓存选项和 image 用法。
提升产品 UI 质量
将独特的排版、布局、颜色和动效指导应用到 Next.js 界面。
试试这些提示
启动基础应用
创建一个简单的 Next.js 16 App Router 项目，使用 TypeScript。包含首页、layout 和一个动态路由。
修复 Route Props
审查这个 Next.js 页面，并为 Next.js 16 更新 params 和 searchParams。简要解释每个必需变更。
添加 Auth Proxy
实现一个 Next.js 16 proxy.ts 和 API route 模式，用于通过 httpOnly cookies 处理已认证的 dashboard 请求。
规划迁移
审计这个 Next.js 15 项目，以升级到 Next.js 16。优先处理 routing、cache、Turbopack、image 和 proxy 变更。
最佳实践
- 在接近版本边界时，查看官方 Next.js 发布说明。
- 在生产中使用示例前，确保它们已适配项目架构。
- 运行或保存第三方 MCP 和 npm 命令前先进行审查。
避免
- 在 Next.js 16 route files 中使用同步 params 或 searchParams。
- 为新的 Next.js 16 proxy 行为创建 middleware.ts。
- 将占位 fetch URLs、tokens 或 proxy 示例原封不动复制到生产环境。
常见问题
这个技能帮助构建什么？
它帮助使用当前 App Router 和前端模式构建并迁移 Next.js 16 应用。
它支持 Claude、Codex 和 Claude Code 吗？
是。技能元数据列出 Claude、Codex 和 Claude Code 为受支持工具。
它可以升级 Next.js 15 项目吗？
可以。它涵盖 async route props、proxy.ts、Turbopack、cacheComponents、image 变更和 parallel route defaults。
它包含 UI 设计指导吗？
包含。它包含面向 React 界面的排版、颜色、布局、动效和视觉方向指导。
它会自行运行网络请求吗？
不会。网络调用只是作为应用示例出现，并不是技能执行行为。
应该审查 MCP 设置命令吗？
应该。在将第三方 MCP packages 添加到本地配置前，请先审查并固定版本。
开发者详情
作者
Asmayaseen许可证
MIT
Skillstore 修订
r2
版本提示
作者未声明版本。
引用
89edfdc710d0846129dcee6a929477b04f08052c
维护新鲜度
2026/7/24
使用量
13 次下载 · 428 次浏览
文件结构