51CTO 博客地址：https://blog.51cto.com/13969817
Microsoft Teams旨在“满足用户”----无论你在哪里或者如何工作，都能提高生产力和协作能力，客户正在使用Teams及其应用生态系统来支持他们独特需求的不同工作场景，比如移动优先场景的需求不断增长，为了满足这些需求，开发人员需要工具和资源来为桌面版和移动平台构建创新团队应用程序。
Microsoft Teams JavaScript Client SDK是构建Teams应用程序时应该使用的工具，可以方便地在桌面版和移动应用程序开发团队中集成自己的服务，微软于2021年3月中旬宣布四种设备功能：图像、麦克风、位置和QR/条形码扫描器，开发者可以利用它们来点亮新的、引人注目的场景，这些高价值的体验是SDK中的开箱即用，可以用最少的努力来利用、减少应用开发的障碍。
从设备摄像机中获取或选择Media
对于你想要构建涉及设备相机或图片库的场景，我们已经介绍了SelectMedia()API. 这个API允许用户从设备相机中获取或选择Media,并将其返回到web应用程序，作为对selectMedia的响应，web应用程序接收选定图像的media id和选定media的缩略图，本机相机控制是Microsoft Office Lens SDK支持的，它允许高级功能，如扫描文档和白板，让用户利用编辑功能，如裁剪，旋转和注释图像。
Sample Code：调用SelectMedia API来使用相机捕捉图像
let imageProp: microsoftTeams.media.ImageProps = {
sources: [microsoftTeams.media.Source.Camera, microsoftTeams.media.Source.Gallery],
startMode: microsoftTeams.media.CameraStartMode.Photo,
ink: false,
cameraSwitcher: false,
textSticker: false,
enableFilter: true,
};
let mediaInput: microsoftTeams.media.MediaInputs = {
mediaType: microsoftTeams.media.MediaType.Image,
maxMediaCount: 10,
imageProps: imageProp
};
microsoftTeams.media.selectMedia(mediaInput, (error: microsoftTeams.SdkError, attachments: microsoftTeams.media.Media[]) => {
if (error) {
if (error.message) {
alert(" ErrorCode: " + error.errorCode + error.message);
} else {
alert(" ErrorCode: " + error.errorCode);
}
}
if (attachments) {
let y = attachments[0];
img.src = ("data:" + y.mimeType + ";base64," + y.preview);
}
});
Sample Code：调用GetMedia API检索大块的大型Media
let media: microsoftTeams.media.Media = attachments[0]
media.getMedia((error: microsoftTeams.SdkError, blob: Blob) => {
if (blob) {
if (blob.type.includes("image")) {
img.src = (URL.createObjectURL(blob));
}
}
if (error) {
if (error.message) {
alert(" ErrorCode: " + error.errorCode + error.message);
} else {
alert(" ErrorCode: " + error.errorCode);
}
}
});
从设备麦克风录制音频
你还可以设计强大的场景，包括使用设备麦克风，我们已经增强了SelectMedia()API以支持音频录制能力，这允许终端用户通过设备麦克风录制音频，并在提交之前预览音频文件，该功能支持的相关场景包括需要在设备上快速捕捉笔记的agent的实时笔记。
从地图上获取并显示设备位置
对于终端用户共享当前位置并在地图上选择特定位置的场景，我们已经在Teams JavaScript客户端SDK中引入了Getlocation()API,此外，可以利用showlocation()API在支持本机位置的应用程序中打开位置坐标。
Sample Code：调用GetLocation API来检索位置
let locationProps = {"allowChooseLocation":true,"showMap":true};
microsoftTeams.location.getLocation(locationProps, (err: microsoftTeams.SdkError, location: microsoftTeams.location.Location) => {
if (err) {
output(err);
return;
}
output(JSON.stringify(location));
});
Sample Code：调用showlocation API来显示位置
let location = {"latitude":17,"longitude":17};
microsoftTeams.location.showLocation(location, (err: microsoftTeams.SdkError, result: boolean) => {
if (err) {
output(err);
return;
}
output(result);
});
利用设备摄像头进行二维码或条形码扫描
对于需要用户扫描条形码来完成工作流的场景，我们在Teams Client SDK中引入了ScanBarCode()API，条码是一种以可视化和机器可读形式表示数据的方法，这种功能让Teams Webapp利用Microsoft Office Lens SDK支持的扫描器控制来读取数据，并将细节分享给底层应用程序，这些可以帮助清除一些活动中繁重的手动组件。
Sample Code：调用ScanBarCode() API来扫描QR或条形码使用摄像头:
const config: microsoftTeams.media.BarCodeConfig = {
timeOutIntervalInSec: 30};
microsoftTeams.media.scanBarCode((error: microsoftTeams.SdkError, decodedText: string) => {
if (error) {
if (error.message) {
output(" ErrorCode: " + error.errorCode + error.message);
} else {
output(" ErrorCode: " + error.errorCode);
}
} else if (decodedText) {
output(decodedText);
}
}, config);
随着Teamjavascript客户端SDK 1.9版本的发布，以上所有功能都可以使用了，这些功能都将继承people picker高价值组件、视频捕捉、播放器功能和图像捕捉、定位功能，你可以使用这些api在你的Teams应用程序中为移动工作人员启用创新场景的协作模式。
相关资料：
- Device capabilities – Overview
- Request device permissions
- Media APIs (camera, photo gallery, mic)
- Integrate location capabilities.
- QR/Bar code scanner APIs