如何在Microsoft Teams Tab里拿到上下文

微软在推出Teams后不久就支持在Team内添加自定义Tab功能,这个功能对很多用户来说可以说是非常有用了,可以接入自己的各种业务系统,这样就可以很好的将众多系统集成在一个平台里,方便用户查找操作,不用在各种系统间来回切换。

这里为了说明,简单粗暴将Bing主页添加进来做个展示,当然实际中可以加自己的各种系统【具体操作可以戳https://docs.microsoft.com/en-us/microsoftteams/platform/concepts/tabs/tabs-overview】。

如果添加的业务系统比较简单,或者只是知识库一类的,当然没有任何问题。有时候,我们需要在Tab里拿到登录用户的信息,比如登录名(userPrincipalName,displayName等等),那么这种情况我们怎么拿到呢?其实,也很简单,微软已经为我们提供了官方的javascript api【以sdk形式提供,也支持npm package安装】。

以各种姿势引入————————————————————————

<!-- 通过CDN引用,找到自己想要的版本 -->
<script src="https://statics.teams.microsoft.com/sdk/{v1.4.2}/js/MicrosoftTeams.min.js" crossorigin="anonymous"></script>
 
<!-- 如果是npm安装的,指定版本或最新版本,进行引用 -->
<script src="node_modules/@microsoft/teams-js@1.4.2/dist/MicrosoftTeams.min.js"></script>

<!-- 如果需要copy到项目部署本地,也可以下载某版本,添加到项目中进行引用 -->
<script src="MicrosoftTeams.min.js"></script>

引入后可以访问各种上下文属性

<script type="text/javascript">
    // 调用API获取属性
    microsoftTeams.getContext(function (context) {
        var upn = context.userPrincipalName;
    });
</script>

还有其他属性,可以戳 https://docs.microsoft.com/en-us/javascript/api/@microsoft/teams-js/microsoftteams.context?view=msteams-client-js-latest

以上,简单介绍了官方提供的js sdk api,可以获取上下文信息。当然,除此之外,如果使用react的童鞋,微软也提供了对应的package,大家可以自行搜索,如果有机会,再跟大家share一下相关内容。

 

©️2020 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页