本地运行Vue 2 Azure静态Web应用时对接Auth0获取访问令牌

线上已发布环境：可以获取访问令牌 #

你当前看不到访问令牌，大概率是配置遗漏了关键步骤：

• 配置权限范围与回调地址：在SWA的staticwebapp.config.json认证配置中，通过additionalLoginParams指定包含API访问权限的scope（例如scope=openid profile email api://{你的Auth0 API ID}/read）；同时确保Auth0应用的允许回调URL包含SWA的/.auth/login/auth0/callback地址。
• 获取令牌的两种方式：
  • 调用SWA托管的后端API时，SWA会自动将访问令牌附加到请求的Authorization头中，后端直接读取即可。
  • 若前端需要直接使用令牌，可采用自定义登录流程（而非SWA内置登录页），在Auth0授权回调完成后直接捕获令牌，再同步到SWA的认证会话中。

本地SWA模拟器：暂不支持直接获取真实访问令牌 #

目前SWA CLI模拟器的自定义认证仅做流程模拟，不会实际调用Auth0的令牌端点返回真实令牌，可通过两种方案绕开：

• 本地直接集成Auth0 SDK：在Vue应用中引入auth0-spa-js，本地开发时直接对接Auth0租户获取令牌，线上环境切换为SWA的认证流程。
• 模拟认证端点：自定义本地中间件，模拟/.auth/me和/.auth/login/auth0端点，返回包含测试用访问令牌的响应，让Vue应用的请求逻辑保持一致。

内容的提问来源于stack exchange，提问作者Ryan Buening