開發Microsoft Teams選項卡應用安全注意事項

咱們都知道，爲了方便廣大的開發人員快速開發Microsoft Teams選項卡應用，微軟提供了一個JS SDK，你能夠經過這裏 https://docs.microsoft.com/en-us/javascript/api/overview/msteams-client?view=msteams-client-js-latest#:~:text=Microsoft%20Teams%20JavaScript%20client%20SDK%201%20Finding%20the,can%20use%20import%20syntax%20to%20import%20specific%20modules. 瞭解更多詳情。

在這個SDK中，咱們常常會用Context對象去獲取當前的上下文信息，例如用戶信息啦，所在的團隊或頻道信息等等。

https://docs.microsoft.com/en-us/javascript/api/@microsoft/teams-js/context?view=msteams-client-js-latest

可是這裏其實有一個潛在的安全問題：若是這個網頁不是在Teams中運行，而是被別有用心的人員在外部套了一個iframe，而且模擬了一個相似的Context對象的話，有可能進行安全方面的攻擊。

那麼，若是設計一個更加安全的機制，不容許咱們的網頁被其餘系統隨意地用iframe嵌入，只容許在Teams中進行嵌入呢？

能夠經過X-Frame-options這個服務器選項來控制。請參考 https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Frame-Options

但這個選項目前要麼設置容許全部域訪問，要麼設置全部域都不能訪問。

 

第三個選項如今是不推薦使用的，取而代之的是一個新的HTTP Header，叫作CSP， Content-Security-Policy

 

你須要將以下幾個域名加入進去

teams.microsoft.com

*.teams.microsoft.com

*.skype.com *.sharepoint.com

outlook.office.com

and the current host

 

 

若是你是用nodejs來開發，如今也有一個簡單的作法來實現這樣的需求

https://www.npmjs.com/package/express-msteams-host

 

 

在具體的代碼中，還能夠很容易地檢測當前是否是在Teams中運行，以下範例代碼