（此文章同時發表在本人微信公眾號“dotNET開發經驗談”，歡迎右邊二維碼來關注。)
題記：這是一個給初學者（尤其對VS不熟悉的BI工程師）的入門操作向導。
Qlik Sense是Qlik公司推出的第二代BI產品，它的架構設計的很靈活，實現了前后端分離，所以理論上你可以只使用Sense的后端，而完全自定義前端展示。其實Qlik自帶的Hub就可以看作是一個官方實現的前端。
除了架構的靈活性以外，Sense在前端部分也提供了很強的擴展和集成能力，比如可以通過Mashup來自定義頁面，甚至可以把報表或者可視化對象嵌入到外部Web應用程序中。Mashup本質也是一種嵌入機制，區別只是在於Mashup的頁面是由Sense服務器托管。
要在自己的Web應用（比如ASP.NET MVC應用）中嵌入Sense其實很簡單，Qlik已經為我們提供了一個針對Visual Studio的插件——Qlik Analytics plugin for Visual Studio（以下簡稱Qlik插件）。當然，如果你不使用Visual Studio的話，也可以下載Qlik Explorer for Developers。因為嵌入方式主要在前端，所以嵌入的Web應用可以是任何開發技術開發的。Qlik插件的基本功能就是讓我們可以瀏覽Sense中的所有元素，並把腳手架代碼添加到我們的項目代碼中。
具體的步驟如下：
1，安裝Visual Studio 2015 Community，完成VS的安裝后，下載並安裝Qlik Analytics plugin for Visual Studio。
2，啟動Visual Studio，通過菜單“View-Other Windows-Qlik Analytics for Visual Studio”來打開插件，如下圖所示：
3，在Qlik插件中，點擊左上角的服務器圖標來連接到Sense服務器。服務器可以是桌面版的地址（http://localhost:4848/）也可以是本機或者遠程Sense服務器地址（http[s]://server.domain.com[:port]/[VirtualProxy]）。如下所示：
4，Qlik插件連接到服務器或者桌面版之后，根據不同的連接地址，顯示的內容有所不同。連接桌面版會列出qvf，而連接服務器會先顯示所有流，在流之下再顯示App。在每個Sense App下面會列出其包含的書簽、字段、主可視化對象（包括篩選器和列表）、主維度、主度量、變量、工作表（Sheet）。每個工作表下面還會列出包含的可視化對象。如下圖所示：
5，在Qlik插件中的下半部分，有Preview和Code兩個標簽頁。在選擇一個可視化對象的時候，預覽標簽頁可以顯示這個可視化對象的靜態圖。而Code可以為選中對象顯示如下信息的腳手架代碼：
- html：基於div的html腳手架代碼，不是所有對象都適用
- 服務器節點：服務器連接信息的html腳手架代碼
- App節點：操作和導航按鈕的html腳手架代碼，包括：ClearAll、Back、Forward、DoReload
- 書簽對象節點：啟用書簽的html腳手架代碼
- 字段對象節點：字段操作的html腳手架代碼，包括：Select All、Select Alternative、Select Excluded、Select Possible、Lock、Unlock、Select、Select Match、Select Values、Clear
- 可視化對象節點：可視化對象的html腳手架代碼
- Sheet對象節點：Sheet對象的html腳手架代碼
- id：所有對象節點（不包括服務器節點、流節點和文件夾節點）的實體ID
- iframe：和html類似，只是基於iframe的代碼
- layout：具有id的對象節點的對象模型數據結構的json代碼
- properties：具有id的對象節點的對象屬性數據結構的json代碼
6，通過VS的菜單“File-New-Project”來打開新建項目的對話框，選擇Web模版中的“ASP.NET Web Application”，重命名項目名稱，比如“EmbeddedSense”，如下圖所示：
7，在上圖中點擊OK之后，會讓你選擇ASP.NET所使用的技術，選擇MVC后，點擊“Change Authentication”按鈕，並選擇“Windows Authentication”。這樣做的原因是為了通過Windows驗證來單點登錄Sense服務器。當然使用其他驗證方式也可以，只是就需要根據Sense的SSO規范來額外做驗證集成的開發。其他不用修改，就點OK。注意，理論上選擇Web Forms或者SPA也可以，因為嵌入的主要工作在前端，這里僅以MVC舉例。如下圖所示：
8，創建好MVC項目之后，_Layout.cshtml文件（在Views\Shared文件夾里面），在Qlik插件中選擇服務器節點的html代碼，拖動到“</head>”之上，保存更改。如下圖所示：
9，打開“Views\Home\Index.cshtml”文件，把三個“<div class="col-md-4">”標簽里面的內容刪除。任意選擇三個可視化對象的html代碼，拖動到原來的三個位置中。如下圖所示：
10，按F5運行Web應用，就可以在首頁上看到Sense的可視化對象已經嵌入到你自己開發的Web應用中了。如下圖所示：
注意：如果可視化對象不能顯示，可以嘗試使用IE瀏覽器來查看；如果報錯，可能是Qlik插件和服務器版本有兼容性問題，可以把_Layout.cshtml中qlik.setOnError方法注釋掉。
預告：接下來我會分享如何把微軟的Power BI嵌入到你的Web應用中。