自定义Teams应用在New Teams中加载SharePoint页面异常求助

我创建了几款简单的自定义Teams应用，核心是将租户内的SharePoint页面作为静态标签页展示（比如一款应用包含多个支持站点页面标签）。通过Developer Portal快速搭建后，在个人作用域添加SharePoint站点作为静态标签页，旧版Teams运行正常，但在New Teams中出现异常：

• 首次启动或重启Teams后，标签页无法加载SharePoint站点
• 必须先打开一款基于Viva Connections创建、能正常加载SharePoint站点的应用，切回原应用后才能正常显示，重启Teams后需重复操作

• 在Teams中通过Developer Portal创建自定义应用
• 创建标签页功能，添加指向SharePoint站点的标签页
• 预览应用：New Teams中无法加载站点（截图：显示SharePoint站点加载失败的空白/错误页面）
• 启动一款可正常加载SharePoint站点的应用（如另一款自定义应用）
• 此时自定义应用可正常使用，直到重新安装或修复Teams（截图：SharePoint站点正常加载显示内容）

New Teams的身份验证流程与旧版存在差异：旧版Teams会自动处理SharePoint站点的租户身份验证上下文，而New Teams对于未配置完整SSO的静态标签页，可能没有预先初始化SharePoint所需的身份验证会话。Viva Connections类应用启动时会触发完整的租户身份验证流程，间接为其他应用初始化了必要的上下文。

方案1：为标签页配置简化的SSO（推荐） #

即使是静态标签页，也可以通过配置基础的SSO来让New Teams自动处理身份验证：

1. 在Developer Portal中打开你的应用，进入标签页配置页面
2. 编辑目标SharePoint标签页，在身份验证部分选择Microsoft Entra ID
3. 配置以下参数：
   • 客户端ID：使用应用注册的客户端ID（可在Developer Portal的应用注册页面获取）
   • 权限范围：添加Sites.Read.All（根据你的需求调整权限）
   • 登录URL：填写你的SharePoint站点根URL（如https://yourtenant.sharepoint.com/sites/yoursite）
4. 保存配置并重新打包部署应用

方案2：在标签页中手动触发身份验证跳转 #

如果不想配置完整SSO，可以在静态标签页的加载逻辑中添加身份验证检测：

1. 创建一个简单的HTML页面作为中间跳转页，托管在你的租户内（如SharePoint站点的文档库）
2. 在中间页中添加脚本，检测当前是否有有效的SharePoint身份验证会话：

   // 检测是否已登录SharePoint
   async function checkSPAuth() {
     try {
       const response = await fetch('https://yourtenant.sharepoint.com/sites/yoursite/_api/web', {
         headers: { 'Accept': 'application/json;odata=nometadata' }
       });
       if (response.ok) {
         // 已登录，跳转到目标页面
         window.location.href = 'https://yourtenant.sharepoint.com/sites/yoursite/yourpage.aspx';
       } else {
         // 未登录，触发Teams身份验证
         microsoftTeams.authentication.authenticate({
           url: window.location.origin + '/auth-start.html',
           width: 600,
           height: 535,
           successCallback: () => window.location.href = 'https://yourtenant.sharepoint.com/sites/yoursite/yourpage.aspx',
           failureCallback: (reason) => alert('身份验证失败: ' + reason)
         });
       }
     } catch (err) {
       console.error('Auth check failed:', err);
     }
   }
   // 初始化Teams SDK后执行检测
   microsoftTeams.initialize();
   checkSPAuth();
   

3. 在中间页头部引入官方Teams SDK脚本（可从微软Teams开发者文档获取最新版本）
4. 在Developer Portal中，将标签页的URL修改为这个中间跳转页的地址

方案3：修改Teams应用清单的权限声明 #

在应用清单中添加必要的权限声明，让New Teams提前加载身份验证上下文：

1. 在Developer Portal中进入应用清单编辑页面
2. 在webApplicationInfo部分添加：

   "webApplicationInfo": {
     "id": "你的应用注册客户端ID",
     "resource": "https://yourtenant.sharepoint.com"
   }
   

3. 在authorization部分添加：

   "authorization": {
     "permissions": {
       "resourceSpecific": [
         {
           "name": "Sites.Read.All",
           "type": "Application"
         }
       ]
     }
   }
   

4. 保存并重新部署应用

1. 重新安装自定义应用到New Teams
2. 直接打开应用，检查SharePoint标签页是否能正常加载
3. 重启Teams后再次验证，确认无需依赖其他应用即可正常显示

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