ASP.NET Core2调用Azure云上的PowerBI报表展示

在开发企业应用中，报表功能是当之无愧的重头戏，如何将数据通过合适的报表呈现出来成为每个项目人员必需面临的问题。而找到一款合适的报表往往都需要考率价格、开发、风格、支撑等因素。那么，我在这里给大家介绍一款由微软提供的可视化报表工具power bi，并通过asp.net core2程序调用云端的报表（国内的azure云），并用代码方式将报表与项目程序集成起来，以供你有个更好的选择。

 

power bi

power bi 是一套商业分析工具，用于在团队组织中提供数据报表呈现，并支持多种不同的数据源连接，可生成美观的报表并进行发布，供团队人员在 web端与和移动端上使用。微软power bi 工具同时提供一个pc桌面版的客户端“power bi desktop”帮助用户来设计报表，还提供了一套基于azure云端的报表发布部署环境“power bi embedded”。而这里我们主要介绍借助“power bi embedded”完成报表集成。如下是跟power bi相关的网址：

power bi 中文官网：

power bi embedded 中文官网：

 

准备

在着手开始实现之前咱们需准备一些必要的环境，如下：

1、在azure上创建一个名为“iot-pbi”的power bi 工作区集合，并获取其访问key，留待后面使用。

2、通过power bi desktop工具来设计一个报表名为“work1.pbix”，并保存到本地磁盘。

3、从github上下载一个由微软开源的管理azure端power bi工作区的命令行工具”provisionsample“的代码，使用vs2017打开项目后并编译它。代码地址：https://github.com/azure-samples/power-bi-embedded-integrate-report-into-web-app。

4、成功编译后在其bin目录找到“provisionsample.exe.config”文件，将其打开，并按自身情况填写，如下：

  1 <appsettings file="cloud.config">
  2 	<!-- azure订阅id-->
  3 	<add key="subscriptionid" value="" />
  4 	<!-- azure资源分组名称-->
  5 	<add key="resourcegroup" value="" />
  6 	<!-- powerbi工作区集合名称 -->
  7 	<add key="workspacecollectionname" value="" />
  8 	<!-- powerbi工作区集合名称访问key -->
  9 	<add key="accesskey" value="" />
 10 	<!-- powerbi工作区id-->
 11 	<add key="workspaceid" value="" />
 12 	<!-- azure登录账号 -->
 13 	<add key="username" value="" />
 14 	<!-- azure登录密码 -->
 15 	<add key="password" value="" />
 16 </appsettings>

 

5、用vs2017开发工具创建一个asp.net core2带视图的项目名“webapplication1”。

 

实现

通过上述的准备后，咱们就可以进入具体的发布与集成工作了，如下：

1、因为azure的用户台上暂时没法直接创建power bi的工作区与报表，所以我们必需借助从github下载编译的工具“provisionsample”来完成power bi的工作区与报表的管理工作。在bin目录下找到“provisionsample.exe”文件启动它，截图如下：

 

2、依次输入命令“1”、“6”来创建一个新的工作区，并获取该工作区的id。

3、依次输入命令“2”、“3”来将本地磁盘的文件“work1.pbix”导入到azure端，并获取该报表的id。

4、通过上面几步后我们已将本地的报表发布到azure云端了，那么咱们下一步就来看看如何在asp.net core2项目集成该云端的报表吧。首先，需在asp.net core2项目中通过nuget管理器引用第三方库“powerbi.netstandard.api”（azure官网提供的类库“microsoft.powerbi.core”暂时不支持asp.net core），该库的作用是帮助我们可以很简便的获取报表授权的token，后端代码如下：

  1 using system;
  2 using system.collections.generic;
  3 using system.linq;
  4 using system.threading.tasks;
  5 using microsoft.aspnetcore.mvc;
  6 
  7 namespace webapplication1.controllers
  8 {
  9     public class powerbicontroller : controller
 10     {
 11         //工作区集合名称，按自身情况填写
 12         private string workspacecollection = "";
 13         //工作区id，按自身情况填写
 14         private string workspaceid = "";
 15         //报表id，按自身情况填写
 16         private string reportid = "";
 17         //工作区集合访问key，按自身情况填写
 18         private string token = "";
 19 
 20         public iactionresult index()
 21         {
 22             //获取报表访问的授权token
 23             var embedtoken = powerbitoken.createreportembedtoken(workspacecollection, workspaceid, reportid);
 24             var ebtoken = embedtoken.generate(token);
 25             viewbag.strtoken = ebtoken;
 26             return view(viewbag);
 27         }
 28     }
 29 }

 

5、后端代码编写完成后，在视图层加入如下前端代码：

  1 <script src="https://microsoft.github.io/powerbi-javascript/demo/node_modules/jquery/dist/jquery.js"></script>
  2 <script src="https://microsoft.github.io/powerbi-javascript/demo/node_modules/powerbi-client/dist/powerbi.js"></script>
  3 
  4 <div id="reportcontainer" style="width:100%;height:850px;"></div>
  5 <script>
  6     var token ='@viewbag.strtoken';
  7     var embedconfiguration = {
  8         type: 'report',
  9         accesstoken: token,
 10         id: 'b5904f26-47cc-4455-9025-06258ea5d8f5',
 11         embedurl: 'https://embedded.powerbi.cn/apptokenreportembed'
 12     };
 13 
 14     var reportcontainer = $('#reportcontainer');
 15     var report = powerbi.embed(reportcontainer.get(0), embedconfiguration);
 16 </script>

 

6、至此，基于asp.net core2项目的前后端代码就全部编写完成，运行项目后效果如下：

 

总结

1、azure云的用户台暂时没提供管理power bi工作区、报表的功能，所以这里借助开源工具“provisionsample”来完成管理。

2、power bi发布到网页前端后是通过由后端生成的一个token来完成身份认证的，如果没有该token报表则无法正常打开呈现。

3、azure官网提供的类库“microsoft.powerbi.core”暂时不支持asp.net core，这里使用第三方库“powerbi.netstandard.api”来获取报表的授权token。

 

声明

本文为作者原创，转载请备注出处与保留原文地址，谢谢。如文章能给您带来帮助，请点下推荐或关注，感谢您的支持！