會議中的Meeting App

接著我們上兩篇博客文章,我們說了如何開發會議前和會議后的 meeting app,那如何開發一個會議中的 app 呢,實際上比較簡單,我們只需要在 tab 的配置項中勾選下面這兩個選項即可。

in-meeting-app

勾選后,我們安裝app到我們的一個會議中,然后開始會議,在會議的工具條上就可以看到我們的app的圖標,點擊后就會出現側邊欄。如下圖:

in-meeting-app

在側邊欄的上方有一個向上的小箭頭。這個圖標和共享桌面的圖標類似,點擊后實際上就是共享我們的app給所有用參與會議的人

in-meeting-app

所有參與會議的用戶都會在會議窗口的正中間顯示出我們的app,如下圖所示。

in-meeting-app

這個功能就是我們前面所勾選的 “Share to stage”。

看到這里,大家可能會問,前幾篇文章提到的tab,和這里的側邊欄的tab,和stage中的tab,我們都是使用同一個頁面,那如果我們想要顯示給用戶看不同內容,有什么方法嗎?也就是說這個頁面本身如何判斷出自己當前是怎么被 teams 調用到的。

到我寫這篇文章的時候,官方文檔里我并沒有找到答案,所以我自己做了一些實驗,一開始的設想是url,所以我把url都打印了出來,發現 teams 并沒有在url上做什么特別的設置,實際上我覺得 teams 可以在 query string上做一些處理。

做了一些嘗試之后,我發現上篇文章講的 getContext 中一個參數?frameContext?就可以表明當前頁面所在的場景。

我們在?Configure.cshtml?里增加這個腳本。

...<div id="meeting-context"></h1>
...<script>microsoftTeams.initialize();microsoftTeams.getContext(function(context) {document.getElementById('meeting-context').innerText = "FrameContext: " + context.frameContext;});

同樣,我們在?MainPage.cshtml?里也加上類似的代碼:

<body style="background: white"><h1>MainPage</h1><div id="meeting-context"></div><script>microsoftTeams.initialize();microsoftTeams.getContext(function(context) {document.getElementById('meeting-context').innerText = "FrameContext: " + context.frameContext;});</script>
</body>

讓我們再來重新安裝和使用 meeting app,看看能得到什么內容。

這個是安裝頁面:

in-meeting-app

這個是會議聊天界面里的tab:

in-meeting-app

這個是會議詳情界面里的tab:

in-meeting-app

這個是會議中的側邊欄和共享app的界面:

in-meeting-app

可以看到我們得到了不同的值,在配置界面是?settings,在會議聊天界面和會議詳情界面是?content,在會議中的側邊欄是?sidePanel,在 stage 界面是?meetingStage。有了這些信息后我們就可以在我們的頁面中顯示不同的內容了。

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/277844.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/277844.shtml
英文地址,請注明出處:http://en.pswp.cn/news/277844.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

0-2歲的app開發人員必讀,Android開發APP前的準備事項

2019獨角獸企業重金招聘Python工程師標準>>> 隨著移動互聯網的興起&#xff0c;各行各業對移動應用的需求越來越大&#xff0c;從事APP開發的人也越來越多&#xff0c;APP開發行業可以說是方興未艾。APP開發是比較復雜的事情&#xff0c;涉及產品、美工設計、服務器…

FixedThreadPool吞掉了異常

為了方便遍描述問題&#xff0c;如下是簡化后的 public class RunException {public static void main(String[] args) { ExecutorService readerPool Executors.newFixedThreadPool(3); readerPool.submit(new Runnable() { public void run() { throw new RuntimeException(…

Teams Meeting App的 task 彈出框

前幾篇文章我們介紹了 Teams Meeting App 的各種類型和如何從無到有的使用 net6 和 c# 來開發一個 Teams Meeting app&#xff0c;那今天我們開始討論一些 meeting app 的高級互動&#xff1a; task 彈出框。我們先來快速修改一下之前的代碼&#xff0c;看看什么是 task 彈出框…

react 學習

react官網地址&#xff1a;http://facebook.github.io/react/ webpack官網地址&#xff1a;http://webpack.js.org/ 英文 https://www.webpackjs.com/ 中文 參考資料&#xff1a; React 入門實例教程-阮一峰 webpack的學習 學習列表&#xff1a; 了解react的語法&#x…

如何獲取Teams Meeting 詳情

最近有一些朋友問我&#xff0c;有沒有可能獲取到會議的詳情&#xff0c;我搜索了目前所有的 teams 文檔&#xff0c;發現有一個api可以獲取&#xff0c;不過在我寫這篇文章的時候&#xff0c;這個 api 還在 preview 階段&#xff0c;可能在正式發布前&#xff0c;還會有一些變…

C++ : 內聯函數和引用變量

一.內聯函數 內聯函數和普通函數的使用方法沒有本質區別&#xff0c;我們來看一個例子&#xff0c;下面展示了內聯函數的使用方法&#xff1a; #include <iostream> using namespace std; //下面展示內聯函數的使用 inline double square(double x) {return (x*x);} int…

Teams Meeting 實時事件通知

Microsoft Teams最近推出了很多新的功能和api&#xff0c;我們今天就來一起看一下 teams 會議的實時事件通知&#xff0c;我覺得有了這個功能&#xff0c;我們的app&#xff0c;我們的bot又可以有很多可以實現的場景了。 我們來看看如何在 c# 里處理會議開始和結束這兩個事件。…

error記錄 | 不能將參數 1 從“const char [5]”轉換為“LPCTSTR

Windows使用兩種字符集ANSI和UNICODE&#xff0c;前者就是通常使用的單字節方式&#xff0c;但這種方式處理象中文這樣的雙字節字符不方便&#xff0c;容易出現半個漢字的情況。而后者是雙字節方式&#xff0c;方便處理雙字節字符。Windows NT的所有與字符有關的函數都提供兩…

JMM 學習筆記

并發編程的模型 并發編程需要解決的兩個問題&#xff1a;線程之間如何同步&#xff0c;線程之間如何通信。 線程之間通信&#xff1a;共享內存&#xff0c;消息傳遞。 共享內存通過線程之間讀-寫程序的公共狀態進行通信。消息傳遞要通過線程之間主動傳遞消息進行通信。 線程之間…

嵌套函數,匿名函數,高階函數

目錄 嵌套函數匿名函數高階函數嵌套函數 就是在函數里再定義一個函數 # 1,函數內部可以在定義函數 # 2,函數要想執行&#xff0c;必須要先被調用 def name1():print(kk)def name2():print(vfx)name2() name1() 輸出&#xff1a; kk vfx name2 現在他內部代碼找輸出&#xff0c;…

Teams Developer Portal介紹

在去年的 Build2021 大會上講到的 Teams Developer Portal 已經上線一段時間了&#xff0c;我這幾天玩了一下&#xff0c;發現比之前的 app studio 強大了很多&#xff0c;所以趕快寫篇文章和大家分享。 Developer Portal 有兩種訪問的方式&#xff0c;一個是網頁版&#xff0…

使用環境變量來配置 Teams App 的 manifest

上篇文章我們介紹了 Teams 的 Developer Portal&#xff0c;今天我想分享一個dev portal里一個比較實用的功能。這個功能在之前的 App Studio 里沒有。這個功能叫 Environment variables。 當我們真實開發一個 teams app的時候&#xff0c;肯定有自己的開發環境&#xff0c;測…

[Unity優化]批處理03:靜態批處理

[Unity優化]批處理03&#xff1a;靜態批處理 原理&#xff1a; 運行時&#xff0c;把需要進行靜態批處理的網格合并到一個新的網格中。雖然只進行一次合并操作&#xff0c;但是會占用更多的內存來存儲合并后的網格&#xff0c;并且被靜態批處理的物體無法移動旋轉縮放 要使用靜…

制造領域的人工智能技術

“AI將執行制造、質量控制、縮短設計時間、減少材料浪費、提高生產再利用率&#xff0c;執行預測性維護等等&#xff0c;盡管人工智能有望從根本上改變很多行業&#xff0c;但該技術非常適合制造業”Ng說。Andrew Ng是深度學習Google Brain項目的創始人兼斯坦福大學計算機科學兼…

如何獲取一個會議的 transcripts

Teams 開發團隊在過去半年里提供了很多的關于會議的 api&#xff0c;這讓我們又有了很多的可以實現的功能和場景。今天我要介紹的是如何獲取會議的 transcripts。 首先我們要知道的一個概念是&#xff1a;一個會議 meeting 可能有很多的 transcript&#xff0c;是一對多的關系…

JS獲取IP地址

HTML代碼&#xff1a; <!DOCTYPE html> <html><head><meta charset"UTF-8"><title></title><script src"https://unpkg.com/vue/dist/vue.js"></script></head><body><div id"vm&quo…

1小時玩爆趣頭條自媒體平臺,增粉實戰操作分享

做自媒體的人最關注的就是每天自己賬號的后臺數據&#xff0c;因為數據決定當天的收益。因此只要每天能達到幾十萬的數據&#xff0c;相信對于做自媒體的朋友來說&#xff0c;一個月下來&#xff0c;最少也有1萬以上的收入。目前&#xff0c;自媒體平臺能賺錢的平臺有很多&…

營業額統計

傳送門 這個題...裸題啊,裸的不能再裸了 按天數插入,每次插入之后,比較和前驅后繼的差,取 min 統計入答案即可 注意之前已經插入過的值就不需要插入了.然后這題就 A 了 Code: #include <iostream> #include <cstdlib> #include <cstdio> #include <ctime&…

React setStats數組不更新,百思不得其解。

樓樓今日遇到個坑爹的問題。 就是 this.setStats({}) 對 this.stats 不更新問題 問題是這樣的 constructor(props) {super(props);this.state {imageList: []}WechatService.getMaterialOrealList("image").then((result) > {this.setState({imageList: result})…

隧道6in4 和隧道6to4(GNS3)

隧道6in4實驗配置 拓撲圖 Device Interface IP Address&#xff08;IPv6&#xff09; R1 F 0/0 10.1.81.1 F 0/1 2001:db8:cafe:81::10 R2 F 0/0 10.81.1.2 F 0/1 172.81.1.2 R3 F 0/0 172.81.1.3 F 0/1 2001:DB8:ACE:81::20 R4 F 0/0 2001:db8:cafe:81::4…