Back to Details

azure-static-web-apps

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

Azure Static Web Apps Skill

Azure Static Web Apps Skill

This skill provides expert guidance for Azure Static Web Apps. Covers troubleshooting, decision making, limits & quotas, security, configuration, integrations & coding patterns, and deployment. It combines local quick-reference content with remote documentation fetching capabilities.
本Skill为Azure Static Web Apps提供专业指导，涵盖故障排查、决策制定、限制与配额、安全、配置、集成与编码模式以及部署。它结合了本地速查内容与远程文档获取能力。

How to Use This Skill

如何使用本Skill

IMPORTANT for Agent: Use the Category Index below to locate relevant sections. For categories with line ranges (e.g., 
L35-L120
), use 
read_file
with the specified lines. For categories with file links (e.g., 
[security.md](security.md)
), use 
read_file
on the linked reference file
IMPORTANT for Agent: If 
metadata.generated_at
is more than 3 months old, suggest the user pull the latest version from the repository. If 
mcp_microsoftdocs
tools are not available, suggest the user install it: Installation Guide
This skill requires network access to fetch documentation content:
  • Preferred: Use 
    mcp_microsoftdocs:microsoft_docs_fetch
    with query string 
    from=learn-agent-skill
    . Returns Markdown.
  • Fallback: Use 
    fetch_webpage
    with query string 
    from=learn-agent-skill&accept=text/markdown
    . Returns Markdown.
Agent 注意事项：使用下方的分类索引查找相关章节。对于带有行范围的分类（例如 
L35-L120
），请使用
read_file
工具读取指定行内容。对于带有文件链接的分类（例如 
[security.md](security.md)
），请使用
read_file
工具读取链接的参考文件
Agent 注意事项：如果
metadata.generated_at
的时间超过3个月，请建议用户从仓库拉取最新版本。如果
mcp_microsoftdocs
工具不可用，请建议用户安装该工具：安装指南
本Skill需要网络访问权限来获取文档内容：
  • 推荐方式：使用
    mcp_microsoftdocs:microsoft_docs_fetch
    工具，并携带查询字符串
    from=learn-agent-skill
    ，返回Markdown格式内容。
  • 备用方式：使用
    fetch_webpage
    工具，并携带查询字符串
    from=learn-agent-skill&accept=text/markdown
    ，返回Markdown格式内容。

Category Index

分类索引

CategoryLinesDescription
TroubleshootingL35-L39Diagnosing and fixing common Static Web Apps deployment and runtime issues, including build failures, configuration problems, and troubleshooting tools/logs.
Decision MakingL40-L47Guidance on key architecture choices: Functions hosting model, using Front Door/CDN edge, Next.js deployment options, and comparing Free vs Standard Static Web Apps plans.
Limits & QuotasL48-L53Runtime versions and language support for Static Web Apps, plus plan-specific quotas and limits (storage, bandwidth, functions, concurrency, and resource caps).
SecurityL54-L65Configuring auth, roles, secrets, and access: Entra ID/Graph roles, auth providers, user info, deployment tokens, Key Vault/managed identity, password protection, and private endpoints.
ConfigurationL66-L92Configuring domains, DNS, backends (Functions, App Service, Container Apps, APIM), build/runtime settings, local emulation (SWA CLI), monitoring, and database/network for Static Web Apps.
Integrations & Coding PatternsL93-L101How to connect Static Web Apps APIs to Azure databases (Cosmos DB, SQL, MySQL, PostgreSQL), including Mongoose usage, connection strings, and typical integration patterns.
DeploymentL102-L118Deploying Static Web Apps via GitHub/GitLab/Bitbucket/CLI/ARM/Bicep, configuring CI/CD, preview environments, traffic splitting, and optional Azure Front Door CDN setup
分类行号说明
故障排查L35-L39诊断并修复Static Web Apps常见的部署和运行时问题，包括构建失败、配置问题以及故障排查工具/日志。
决策制定L40-L47关键架构选择指导：Functions托管模型、Front Door/CDN边缘节点使用、Next.js部署选项，以及Free与Standard Static Web Apps方案对比。
限制与配额L48-L53Static Web Apps支持的运行时版本和语言，以及各方案的特定配额与限制（存储、带宽、Functions、并发数和资源上限）。
安全配置L54-L65配置身份验证、角色、密钥与访问权限：Entra ID/Graph角色、身份验证提供商、用户信息、部署令牌、Key Vault/托管标识、密码保护和专用端点。
服务配置L66-L92配置域名、DNS、后端服务（Functions、App Service、Container Apps、APIM）、构建/运行时设置、本地模拟（SWA CLI）、监控以及Static Web Apps的数据库/网络。
集成与编码模式L93-L101如何将Static Web Apps API连接到Azure数据库（Cosmos DB、SQL、MySQL、PostgreSQL），包括Mongoose使用、连接字符串和典型集成模式。
部署管理L102-L118通过GitHub/GitLab/Bitbucket/CLI/ARM/Bicep部署Static Web Apps，配置CI/CD、预览环境、流量拆分，以及可选的Azure Front Door CDN设置

Troubleshooting

故障排查

TopicURL
Troubleshoot common deployment and runtime issues in Azure Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/troubleshooting
主题链接
排查Azure Static Web Apps中常见的部署和运行时问题https://learn.microsoft.com/en-us/azure/static-web-apps/troubleshooting

Decision Making

决策制定

TopicURL
Choose managed vs bring-your-own Azure Functions for Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/apis-functions
Use enterprise-grade edge for Azure Static Web Apps with Azure Front Door and CDNhttps://learn.microsoft.com/en-us/azure/static-web-apps/enterprise-edge
Select Next.js deployment model on Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/nextjs
Choose Azure Static Web Apps Free vs Standard planshttps://learn.microsoft.com/en-us/azure/static-web-apps/plans
主题链接
为Static Web Apps选择托管式或自定义Azure Functionshttps://learn.microsoft.com/en-us/azure/static-web-apps/apis-functions
通过Azure Front Door和CDN为Azure Static Web Apps启用企业级边缘节点https://learn.microsoft.com/en-us/azure/static-web-apps/enterprise-edge
在Static Web Apps上选择Next.js部署模型https://learn.microsoft.com/en-us/azure/static-web-apps/nextjs
选择Azure Static Web Apps Free与Standard方案https://learn.microsoft.com/en-us/azure/static-web-apps/plans

Limits & Quotas

限制与配额

TopicURL
Supported languages and runtime versions for Azure Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/languages-runtimes
Quotas and limits for Azure Static Web Apps planshttps://learn.microsoft.com/en-us/azure/static-web-apps/quotas
主题链接
Azure Static Web Apps支持的语言和运行时版本https://learn.microsoft.com/en-us/azure/static-web-apps/languages-runtimes
Azure Static Web Apps各方案的配额与限制https://learn.microsoft.com/en-us/azure/static-web-apps/quotas

Security

安全配置

TopicURL
Assign Static Web Apps roles using Microsoft Graph and Entra IDhttps://learn.microsoft.com/en-us/azure/static-web-apps/assign-roles-microsoft-graph
Configure authentication and authorization for Azure Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/authentication-authorization
Configure custom authentication providers for Azure Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/authentication-custom
Manage and reset deployment tokens for Azure Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/deployment-token-management
Use Key Vault and managed identity for Static Web Apps auth secretshttps://learn.microsoft.com/en-us/azure/static-web-apps/key-vault-secrets
Enable password protection for Azure Static Web Apps environmentshttps://learn.microsoft.com/en-us/azure/static-web-apps/password-protection
Configure private endpoint access for Azure Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/private-endpoint
Access authenticated user information in Azure Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/user-information
主题链接
使用Microsoft Graph和Entra ID分配Static Web Apps角色https://learn.microsoft.com/en-us/azure/static-web-apps/assign-roles-microsoft-graph
为Azure Static Web Apps配置身份验证与授权https://learn.microsoft.com/en-us/azure/static-web-apps/authentication-authorization
为Azure Static Web Apps配置自定义身份验证提供商https://learn.microsoft.com/en-us/azure/static-web-apps/authentication-custom
管理和重置Azure Static Web Apps的部署令牌https://learn.microsoft.com/en-us/azure/static-web-apps/deployment-token-management
使用Key Vault和托管标识存储Static Web Apps身份验证密钥https://learn.microsoft.com/en-us/azure/static-web-apps/key-vault-secrets
为Azure Static Web Apps环境启用密码保护https://learn.microsoft.com/en-us/azure/static-web-apps/password-protection
为Azure Static Web Apps配置专用端点访问https://learn.microsoft.com/en-us/azure/static-web-apps/private-endpoint
在Azure Static Web Apps中访问已认证用户信息https://learn.microsoft.com/en-us/azure/static-web-apps/user-information

Configuration

服务配置

TopicURL
Configure apex domains with Azure DNS for Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/apex-domain-azure-dns
Configure apex/root domains with external registrars for Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/apex-domain-external
Configure Azure API Management integration with Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/apis-api-management
Link Azure App Service backends to Azure Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/apis-app-service
Integrate Azure Container Apps as APIs for Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/apis-container-apps
Set application settings for Static Web Apps backend APIshttps://learn.microsoft.com/en-us/azure/static-web-apps/application-settings
Configure staticwebapp.config.json for Azure Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/configuration
Configure custom domains for Azure Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/custom-domain
Set up Azure DNS custom domains for Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/custom-domain-azure-dns
Manage default domain routing in Azure Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/custom-domain-default
Use external DNS providers for Static Web Apps custom domainshttps://learn.microsoft.com/en-us/azure/static-web-apps/custom-domain-external
Configure database connections and firewall for Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/database-configuration
Configure build settings for front-end frameworks in Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/front-end-frameworks
Link existing Azure Functions apps to Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/functions-bring-your-own
Configure local development environment for Azure Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/local-development
Use metrics for managed Functions in Azure Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/metrics
Enable Application Insights monitoring for Azure Static Web Apps APIshttps://learn.microsoft.com/en-us/azure/static-web-apps/monitor
Inject runtime snippets into Static Web Apps pageshttps://learn.microsoft.com/en-us/azure/static-web-apps/snippets
Azure Static Web Apps CLI command referencehttps://learn.microsoft.com/en-us/azure/static-web-apps/static-web-apps-cli
Run and proxy API servers with Azure Static Web Apps CLIhttps://learn.microsoft.com/en-us/azure/static-web-apps/static-web-apps-cli-api-server
Configure Azure Static Web Apps CLI with swa-cli.config.jsonhttps://learn.microsoft.com/en-us/azure/static-web-apps/static-web-apps-cli-configuration
Emulate Azure Static Web Apps locally with SWA CLIhttps://learn.microsoft.com/en-us/azure/static-web-apps/static-web-apps-cli-emulator
Use Azure Static Web Apps CLI for local emulation and workflowshttps://learn.microsoft.com/en-us/azure/static-web-apps/static-web-apps-cli-overview
主题链接
使用Azure DNS为Static Web Apps配置顶级域名https://learn.microsoft.com/en-us/azure/static-web-apps/apex-domain-azure-dns
使用外部注册商为Static Web Apps配置顶级/根域名https://learn.microsoft.com/en-us/azure/static-web-apps/apex-domain-external
为Static Web Apps配置Azure API Management集成https://learn.microsoft.com/en-us/azure/static-web-apps/apis-api-management
将Azure App Service后端链接到Azure Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/apis-app-service
将Azure Container Apps集成为Static Web Apps的APIhttps://learn.microsoft.com/en-us/azure/static-web-apps/apis-container-apps
为Static Web Apps后端API设置应用程序配置https://learn.microsoft.com/en-us/azure/static-web-apps/application-settings
为Azure Static Web Apps配置staticwebapp.config.jsonhttps://learn.microsoft.com/en-us/azure/static-web-apps/configuration
为Azure Static Web Apps配置自定义域名https://learn.microsoft.com/en-us/azure/static-web-apps/custom-domain
为Static Web Apps设置Azure DNS自定义域名https://learn.microsoft.com/en-us/azure/static-web-apps/custom-domain-azure-dns
管理Azure Static Web Apps中的默认域名路由https://learn.microsoft.com/en-us/azure/static-web-apps/custom-domain-default
为Static Web Apps自定义域名使用外部DNS提供商https://learn.microsoft.com/en-us/azure/static-web-apps/custom-domain-external
为Static Web Apps配置数据库连接和防火墙https://learn.microsoft.com/en-us/azure/static-web-apps/database-configuration
为Static Web Apps中的前端框架配置构建设置https://learn.microsoft.com/en-us/azure/static-web-apps/front-end-frameworks
将现有Azure Functions应用链接到Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/functions-bring-your-own
为Azure Static Web Apps配置本地开发环境https://learn.microsoft.com/en-us/azure/static-web-apps/local-development
为Azure Static Web Apps中的托管式Functions使用指标https://learn.microsoft.com/en-us/azure/static-web-apps/metrics
为Azure Static Web Apps API启用Application Insights监控https://learn.microsoft.com/en-us/azure/static-web-apps/monitor
向Static Web Apps页面注入运行时代码片段https://learn.microsoft.com/en-us/azure/static-web-apps/snippets
Azure Static Web Apps CLI命令参考https://learn.microsoft.com/en-us/azure/static-web-apps/static-web-apps-cli
使用Azure Static Web Apps CLI运行和代理API服务器https://learn.microsoft.com/en-us/azure/static-web-apps/static-web-apps-cli-api-server
使用swa-cli.config.json配置Azure Static Web Apps CLIhttps://learn.microsoft.com/en-us/azure/static-web-apps/static-web-apps-cli-configuration
使用SWA CLI在本地模拟Azure Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/static-web-apps-cli-emulator
使用Azure Static Web Apps CLI进行本地模拟和工作流管理https://learn.microsoft.com/en-us/azure/static-web-apps/static-web-apps-cli-overview

Integrations & Coding Patterns

集成与编码模式

TopicURL
Use Mongoose with Azure Cosmos DB in Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/add-mongoose
Connect Azure Static Web Apps to Azure Cosmos DBhttps://learn.microsoft.com/en-us/azure/static-web-apps/database-azure-cosmos-db
Connect Azure Static Web Apps to Azure SQL Databasehttps://learn.microsoft.com/en-us/azure/static-web-apps/database-azure-sql
Connect Azure Static Web Apps to Azure Database for MySQLhttps://learn.microsoft.com/en-us/azure/static-web-apps/database-mysql
Connect Azure Static Web Apps to Azure Database for PostgreSQLhttps://learn.microsoft.com/en-us/azure/static-web-apps/database-postgresql
主题链接
在Static Web Apps中使用Mongoose与Azure Cosmos DBhttps://learn.microsoft.com/en-us/azure/static-web-apps/add-mongoose
将Azure Static Web Apps连接到Azure Cosmos DBhttps://learn.microsoft.com/en-us/azure/static-web-apps/database-azure-cosmos-db
将Azure Static Web Apps连接到Azure SQL数据库https://learn.microsoft.com/en-us/azure/static-web-apps/database-azure-sql
将Azure Static Web Apps连接到Azure Database for MySQLhttps://learn.microsoft.com/en-us/azure/static-web-apps/database-mysql
将Azure Static Web Apps连接到Azure Database for PostgreSQLhttps://learn.microsoft.com/en-us/azure/static-web-apps/database-postgresql

Deployment

部署管理

TopicURL
Deploy Bitbucket-hosted apps to Azure Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/bitbucket
Create branch-based preview environments with stable URLshttps://learn.microsoft.com/en-us/azure/static-web-apps/branch-environments
Configure CI/CD build YAML for Azure Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/build-configuration
Deploy Azure Static Web Apps with external CI/CD providershttps://learn.microsoft.com/en-us/azure/static-web-apps/external-providers
Manually configure Azure Front Door as CDN for Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/front-door-manual
Deploy GitLab-hosted apps to Azure Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/gitlab
Create named preview environments in Azure Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/named-environments
Use preview environments and temporary URLs in Azure Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/preview-environments
Deploy Azure Static Web Apps using ARM templateshttps://learn.microsoft.com/en-us/azure/static-web-apps/publish-azure-resource-manager
Deploy Azure Static Web Apps with Bicep templateshttps://learn.microsoft.com/en-us/azure/static-web-apps/publish-bicep
Review pull requests using pre-production environments in Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/review-publish-pull-requests
Deploy static web apps using Azure Static Web Apps CLIhttps://learn.microsoft.com/en-us/azure/static-web-apps/static-web-apps-cli-deploy
Install Azure Static Web Apps CLI with supported platformshttps://learn.microsoft.com/en-us/azure/static-web-apps/static-web-apps-cli-install
Configure traffic splitting between environments in Azure Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/traffic-splitting
主题链接
将Bitbucket托管的应用部署到Azure Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/bitbucket
创建基于分支的带稳定URL的预览环境https://learn.microsoft.com/en-us/azure/static-web-apps/branch-environments
为Azure Static Web Apps配置CI/CD构建YAMLhttps://learn.microsoft.com/en-us/azure/static-web-apps/build-configuration
使用外部CI/CD提供商部署Azure Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/external-providers
手动配置Azure Front Door作为Static Web Apps的CDNhttps://learn.microsoft.com/en-us/azure/static-web-apps/front-door-manual
将GitLab托管的应用部署到Azure Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/gitlab
在Azure Static Web Apps中创建命名预览环境https://learn.microsoft.com/en-us/azure/static-web-apps/named-environments
在Azure Static Web Apps中使用预览环境和临时URLhttps://learn.microsoft.com/en-us/azure/static-web-apps/preview-environments
使用ARM模板部署Azure Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/publish-azure-resource-manager
使用Bicep模板部署Azure Static Web Appshttps://learn.microsoft.com/en-us/azure/static-web-apps/publish-bicep
使用预生产环境审核Static Web Apps的拉取请求https://learn.microsoft.com/en-us/azure/static-web-apps/review-publish-pull-requests
使用Azure Static Web Apps CLI部署静态Web应用https://learn.microsoft.com/en-us/azure/static-web-apps/static-web-apps-cli-deploy
在支持的平台上安装Azure Static Web Apps CLIhttps://learn.microsoft.com/en-us/azure/static-web-apps/static-web-apps-cli-install
在Azure Static Web Apps中配置环境间的流量拆分https://learn.microsoft.com/en-us/azure/static-web-apps/traffic-splitting