最近最熱門的話題莫過于AI了,之前我做過一片講 BOTFRAMEWORK和微信 相結(jié)合的帖子 如何將 Microsoft Bot Framework 鏈接至微信公共號(hào) 我想今天基于這個(gè)題目擴(kuò)展一下,Power BI Embedded 的數(shù)據(jù)展示大致思路是利用Bot framework的卡片展示把 PowerBI embedded 的展示結(jié)果通過更加自然,更加智能的方式展示在前端甚至是微信客戶端,當(dāng)然如果展示在微信端還是需要在微信的公共號(hào)后臺(tái)有一些特殊處理。

首先我想先介紹一下 PowerBI embedded 這個(gè)產(chǎn)品是基于 windows Azure PaaS 層的一個(gè)服務(wù)所以如果您想使用這個(gè)功能您需要一個(gè) Azure的賬戶,不過幸好 Power BI Embedded 價(jià)格不貴按照訪問次數(shù)收費(fèi)并且每個(gè)月都有免費(fèi)次數(shù)所以從成本上非常推薦,其次一個(gè)好消息是這個(gè)服務(wù)在我們中國(guó)版本的 Azure上也同樣提供所以今天我用 中國(guó)版的Azure (MoonCake版)來演示這個(gè)方案。下圖是我從MSND上打劫來的圖說明了一個(gè)非常明顯的問題,在PowerBI中如果您需要?jiǎng)討B(tài)的刷新數(shù)據(jù)那么您的數(shù)據(jù)源是需要設(shè)置成 Azure SQL DB 或者是 Azure SQL Data warehouse。

對(duì)于PowerBI Embedded的數(shù)據(jù)架構(gòu)見下圖 這里最重要的是 workspace collection 中可有有多個(gè) workspace。在每一個(gè) workspace 中可以有多個(gè)dataset 每一個(gè)detaset 對(duì)應(yīng)一個(gè) PowerBI 的 PBIX 文件

所以我就直奔主題如果您想問怎么申請(qǐng) Azure 賬戶 或者什么是 Azure MoonCake 版那么請(qǐng)問度娘或者谷歌。

第一步您需要先創(chuàng)建一個(gè)Power BI  Embedded 的工作區(qū)如下圖,輸入必選項(xiàng)目點(diǎn)擊創(chuàng)建。

photoshop培訓(xùn),電腦培訓(xùn),電腦維修培訓(xùn),移動(dòng)軟件開發(fā)培訓(xùn),網(wǎng)站設(shè)計(jì)培訓(xùn),網(wǎng)站建設(shè)培訓(xùn)

隨后您就可以看到創(chuàng)建好的 Power BI Embedded workspace collection,但是您可以注意到工作區(qū)是空的,這里有個(gè)吐槽點(diǎn)創(chuàng)建工作區(qū)只能使用API而不能通過portal。

photoshop培訓(xùn),電腦培訓(xùn),電腦維修培訓(xùn),移動(dòng)軟件開發(fā)培訓(xùn),網(wǎng)站設(shè)計(jì)培訓(xùn),網(wǎng)站建設(shè)培訓(xùn)

點(diǎn)擊訪問鍵我們可以看到Key值,保存下來一會(huì)兒我們?cè)趧?chuàng)建workspace的時(shí)候要使用。

photoshop培訓(xùn),電腦培訓(xùn),電腦維修培訓(xùn),移動(dòng)軟件開發(fā)培訓(xùn),網(wǎng)站設(shè)計(jì)培訓(xùn),網(wǎng)站建設(shè)培訓(xùn)

接著下一步是創(chuàng)建新的workspace,正如上面說過需要通過 API創(chuàng)建,幸好這里在Github上提供了 中國(guó) Mooncake版本的代碼案例,Mooncake_PowerBI_Embedded 編譯的時(shí)候建議打開VPN因?yàn)橛蠳uget的類庫(kù)要下載, 打開項(xiàng)目以后找到 ProvisionSample - App.config 文件,輸入配置文件節(jié)點(diǎn)數(shù)值(在這輸入可以在 console 中省去輸入的麻煩)。

subscriptionId 在概述頁(yè)面可以找到

resourceGroup 也是在概述頁(yè)面可以找到 資源組

workspaceCollectionName 就是工作區(qū)集合名稱

accessKey 就是上面的Key

 photoshop培訓(xùn),電腦培訓(xùn),電腦維修培訓(xùn),移動(dòng)軟件開發(fā)培訓(xùn),網(wǎng)站設(shè)計(jì)培訓(xùn),網(wǎng)站建設(shè)培訓(xùn)

photoshop培訓(xùn),電腦培訓(xùn),電腦維修培訓(xùn),移動(dòng)軟件開發(fā)培訓(xùn),網(wǎng)站設(shè)計(jì)培訓(xùn),網(wǎng)站建設(shè)培訓(xùn)

隨后運(yùn)行程序即可,由于我們?cè)赾onfig文件中設(shè)置好了數(shù)值,所以只需要按下數(shù)字5就可以創(chuàng)建一個(gè)新的 workspace 隨著創(chuàng)建成功 console 會(huì)返回 workspace ID 當(dāng)然這里您刷新一下portal頁(yè)面也可以在 portal 中看到這個(gè)新的workspace。

 photoshop培訓(xùn),電腦培訓(xùn),電腦維修培訓(xùn),移動(dòng)軟件開發(fā)培訓(xùn),網(wǎng)站設(shè)計(jì)培訓(xùn),網(wǎng)站建設(shè)培訓(xùn)

photoshop培訓(xùn),電腦培訓(xùn),電腦維修培訓(xùn),移動(dòng)軟件開發(fā)培訓(xùn),網(wǎng)站設(shè)計(jì)培訓(xùn),網(wǎng)站建設(shè)培訓(xùn)

那么下一步我們需要上傳一個(gè)做好的 PowerBI 的 PBIX 文件,選擇6 隨后輸入剛剛創(chuàng)建的 workspace ID,隨后會(huì)讓您給您的這個(gè)數(shù)據(jù)集起一個(gè)名字,我這里輸入的是PBIE Dataset, 最后輸入 PBIX的文件路徑,最后會(huì)看到如下圖的結(jié)果說明上傳已經(jīng)成功了。

photoshop培訓(xùn),電腦培訓(xùn),電腦維修培訓(xùn),移動(dòng)軟件開發(fā)培訓(xùn),網(wǎng)站設(shè)計(jì)培訓(xùn),網(wǎng)站建設(shè)培訓(xùn)

 下一步我們需要在一個(gè) ASP.NET 的 MVC Web 站點(diǎn)中 Embedded我們的這個(gè)BI view 幸好剛才的項(xiàng)目中有寫好的demo code  打開 EmbedSample 項(xiàng)目 - Web.config文件 輸入appSettings節(jié)點(diǎn)中的數(shù)值

photoshop培訓(xùn),電腦培訓(xùn),電腦維修培訓(xùn),移動(dòng)軟件開發(fā)培訓(xùn),網(wǎng)站設(shè)計(jì)培訓(xùn),網(wǎng)站建設(shè)培訓(xùn)

photoshop培訓(xùn),電腦培訓(xùn),電腦維修培訓(xùn),移動(dòng)軟件開發(fā)培訓(xùn),網(wǎng)站設(shè)計(jì)培訓(xùn),網(wǎng)站建設(shè)培訓(xùn)

隨后運(yùn)行網(wǎng)站查看效果如下

photoshop培訓(xùn),電腦培訓(xùn),電腦維修培訓(xùn),移動(dòng)軟件開發(fā)培訓(xùn),網(wǎng)站設(shè)計(jì)培訓(xùn),網(wǎng)站建設(shè)培訓(xùn)

photoshop培訓(xùn),電腦培訓(xùn),電腦維修培訓(xùn),移動(dòng)軟件開發(fā)培訓(xùn),網(wǎng)站設(shè)計(jì)培訓(xùn),網(wǎng)站建設(shè)培訓(xùn)

 

做到這里我們就完成了 Power BI Embedded 的工作。當(dāng)然我們還需要講這個(gè)站點(diǎn)部署在IIS上這里您可以部署在 Azure 的 App Service上或者 其他環(huán)境中,測(cè)試通過后我們進(jìn)行下一步開始集成到Bot framework中。

 photoshop培訓(xùn),電腦培訓(xùn),電腦維修培訓(xùn),移動(dòng)軟件開發(fā)培訓(xùn),網(wǎng)站設(shè)計(jì)培訓(xùn),網(wǎng)站建設(shè)培訓(xùn)

此外您有可能遇到這個(gè) feature switch have not been registered yet so switch values may not be correct 的這個(gè)錯(cuò)誤,解決這個(gè)問題也很簡(jiǎn)單您只要通過Nuget更新一下您網(wǎng)站項(xiàng)目中和power BI Embedded相關(guān)的類庫(kù)即可。

接著我我們將這個(gè) Power BI 的站點(diǎn)結(jié)合Bot Framework Attachments, Card的形式集成進(jìn)來其實(shí)原理很簡(jiǎn)單,我這里使用的是Hero Card,利用三方現(xiàn)成的API獲取網(wǎng)頁(yè)快照,當(dāng)然您也可以自己實(shí)現(xiàn)這一功能github上有非常多的開源項(xiàng)目。然后添加一個(gè)超鏈接實(shí)現(xiàn)這個(gè)跳轉(zhuǎn)功能。

如果您還沒有BoT請(qǐng)參考 如何將 Microsoft Bot Framework 鏈接至微信公共號(hào) 這篇文章先創(chuàng)建一個(gè)Bot。

 那么關(guān)鍵一點(diǎn)就是如何添加一個(gè)Bot中的Hero card 請(qǐng)參考這里 Attachments, Cards and Actions 這里我就直接把實(shí)現(xiàn)代碼放給大家,減少?gòu)?fù)雜度我沒有添加LUIS。

實(shí)現(xiàn)效果:

photoshop培訓(xùn),電腦培訓(xùn),電腦維修培訓(xùn),移動(dòng)軟件開發(fā)培訓(xùn),網(wǎng)站設(shè)計(jì)培訓(xùn),網(wǎng)站建設(shè)培訓(xùn)

調(diào)用Hero Card 的代碼

photoshop培訓(xùn),電腦培訓(xùn),電腦維修培訓(xùn),移動(dòng)軟件開發(fā)培訓(xùn),網(wǎng)站設(shè)計(jì)培訓(xùn),網(wǎng)站建設(shè)培訓(xùn)

        private async Task MessageReceivedAsync(IDialogContext context, IAwaitable<object> result)
        {            var activity = await result as Activity;            if (activity.Text.ToLower().Contains("hi") || activity.Text.ToLower().Contains("hello"))
            {                await context.PostAsync("Hi, I can show the report for you, do you want it?");
            }            else if (activity.Text.ToLower().Contains("yes") || activity.Text.ToLower().Contains("ok") || activity.Text.ToLower().Contains("go"))
            {                #region HeroCard

                ConnectorClient connector = new ConnectorClient(new Uri(activity.ServiceUrl));

                Activity replyToConversation = activity.CreateReply("Hi, report is here!");
                replyToConversation.Recipient = activity.From;
                replyToConversation.Type = "message";
                replyToConversation.Attachments = new List<Attachment>();

                List<CardImage> cardImages = new List<CardImage>();                //這里是三方SDK直接URL傳參返回截圖 - 我已經(jīng)去掉了KEY
                cardImages.Add(new CardImage(url: "http://api.page2images.com/directlink?p2i_url=http://pbie.chinacloudsites.cn/Dashboard/Report?reportId=0a46b754-f5a3-4c19-b032-c6599bdb2f4d&p2i_key=yourKey"));

                List<CardAction> cardButtons = new List<CardAction>();

                CardAction plButton = new CardAction()
                {
                    Value = "http://pbie.chinacloudsites.cn/Dashboard/Report?reportId=0a46b754-f5a3-4c19-b032-c6599bdb2f4d",
                    Type = "openUrl",
                    Title = "Show me details!"
                };

                cardButtons.Add(plButton);

                HeroCard plCard = new HeroCard()
                {
                    Title = "Report",                    //Subtitle = "詳細(xì)頁(yè)",
                    Images = cardImages,
                    Buttons = cardButtons
                };

                Attachment plAttachment = plCard.ToAttachment();
                replyToConversation.Attachments.Add(plAttachment);                var reply = await connector.Conversations.SendToConversationAsync(replyToConversation);                //context.Wait(MessageReceivedAsync);
                #endregion
            }            else if (!string.IsNullOrWhiteSpace(activity.Text))
            {                //calculate something for us to return
                int length = (activity.Text ?? string.Empty).Length;                // return our reply to the user
                await context.PostAsync("sorry, I'm trying to learn more, so far I can show the report for you, do you want it?");                //context.Wait(MessageReceivedAsync);            }

            context.Wait(MessageReceivedAsync);
        }

photoshop培訓(xùn),電腦培訓(xùn),電腦維修培訓(xùn),移動(dòng)軟件開發(fā)培訓(xùn),網(wǎng)站設(shè)計(jì)培訓(xùn),網(wǎng)站建設(shè)培訓(xùn)

BotFramework 的完成webChat版本 鏈接 http://bobot.chinacloudsites.cn/

Power BI Embedded 站點(diǎn)鏈接: http://pbie.chinacloudsites.cn/

Power BI Embedded 表單鏈接:http://pbie.chinacloudsites.cn/Dashboard/Report?reportId=0a46b754-f5a3-4c19-b032-c6599bdb2f4d

 希望上的總結(jié)可以幫助到大家, 同時(shí)歡迎大家在這里和我溝通交流或者在新浪微博上 @王博_Nick

http://www.cnblogs.com/sonic1abc/p/6602530.html