ASP.Net MVC 3（Razor Engine）搭配 Microsoft Report 的報表方案

asp.net razor mv rdlc

外獅佬 2012-08-14 09:29:30 ‧ 16625 瀏覽

用ASP.Net MVC 3（使用Razor engine）把整個專案很順利地做到了最後階段--做各式各樣的報表。
原本以為，一切都會很順利....很開心地，用Microsoft Report做了一大堆美美的報表。
在ASP.Net環境下測試都順利..
準備拿到MVC 3給他和在一起，做成撒尿牛丸...
...發現...L 忘了最重要的...Razor根本沒有...ViewState....
當然，用HTML也是可以做出很專業的報表，但是，那並不符合L懶惰的風格
怎麼辦呢？？
ASP.Net有個很好用的報表檢視器（Microsoft Report Viewer），不僅可以檢視、列印美美的報表，甚至可以轉出PDF、Excel檔案格式。
到了ASP.Net MVC 3加上Razor引擎...那些以往好用的控制項，都變得很遙遠。
尤其是報表，當然，用HTML也是可以做出很專業的報表，但是...太...搞剛

那...拿Report Viewer來做...很抱歉...
Razor並沒有所謂的ViewState，而這個是Report Viewer必要的條件，
所以...

很不幸的....L我是一個很懶惰的摳得...
要我用html去做報表，下輩子吧...
於是乎，我們還是用Microsoft Report來做報表吧～

由於，razor不支援ViewState，所以，透過Report Viewer可以將報表輸出成PDF的特性，
再加上三寸不爛之舌，說服了老大，把報表輸出成PDF給user下載、列印。

人客啊～精采的正要開始～

直播研討會

{{ item.channelVendor }} {{ item.webinarstarted }} |

直播中

8 則留言

外獅佬

iT邦大師 1 級 ‧ 2012-08-14 09:44:05

在開始之前：
我的MVC 3開發環境為Visual Studio 2010 SP1 + ASP.Net MVC 3
首先呢，當然是...把MVC 3的環境弄起來，然後...建立一個MVC 3的專案...
這裡使用C#作為範例。

重點：

把Microsoft.ReportViewer.Common.dll、Microsoft.ReportViewer.WebForm.dll這兩個Dll檔，加入到專案參考。
這兩個檔案，可以在vs2010安裝目錄下的ReportViewer資料夾中找到。預設是C:\Program Files\Microsoft Visual Studio 10.0\ReportViewer
加入這兩行
using Microsoft.Reporting.Common;
using Microsoft.Reporting.WebForms;

回應
檢舉

登入發表回應

總裁

iT邦好手 1 級 ‧ 2012-08-14 09:45:17

wiselou提到：
精采的正要開始

有辣妹嗎??...

回應 5
檢舉

看更多先前的回應...收起先前的回應...

外獅佬 iT邦大師 1 級 ‧ 2012-08-14 10:27:32 檢舉

iT邦幫忙MVPcdfu提到：
辣妹

辣妹都名花有煮了...

總裁 iT邦好手 1 級 ‧ 2012-08-14 10:48:43 檢舉

煮熟的也可以吃呀...

外獅佬 iT邦大師 1 級 ‧ 2012-08-14 11:35:45 檢舉

cdfu提到：
煮熟的也可以吃

煮熟的也會飛走啊....

鐵殼心 iT邦高手 1 級 ‧ 2012-08-14 12:42:04 檢舉

努力離題中...

總裁 iT邦好手 1 級 ‧ 2012-08-14 15:00:27 檢舉

wiselou提到：
煮熟的也會飛走啊....

飛走可以再打下來呀...

登入發表回應

外獅佬

iT邦大師 1 級 ‧ 2012-08-14 09:53:12

假設大家對MVC 3都有所認識，畢竟，這個討論串，目的不在MVC 3的語法，在於...L的懶惰

步驟一：當然...是...把rdlc報表檔做好....
步驟二：開始寫程式～～

回應
檢舉

登入發表回應

外獅佬

iT邦大師 1 級 ‧ 2012-08-14 10:00:33

&lt;pre class="c" name="code">
public ActionResult Report(){
  LocalReport localReport = new LocalReport() { ReportPath = Server.MapPath("~/Reports/Report1.rdlc") };
  ReportDataSource reportDataSource = new ReportDataSource("DataSet1", GetProducts());
  localReport.DataSources.Add(reportDataSource);
  string reportType = "PDF";
  string mimeType,encoding,fileNameExtension;
  Warning[] warings;
  String[] streams;
  byte[] renderedBytes;
  string deviceInfo = "&lt;DeviceInfo>" +
                      "  &lt;OutputFormat>PDF&lt;/OutputFormat>" +
                      "  &lt;PageWidth>11.69in&lt;/PageWidth>" +
                      "  &lt;PageHeight>8.27in&lt;/PageHeight>" +
                      "  &lt;MarginTop>0.5in&lt;/MarginTop>" +
                      "  &lt;MarginLeft>0.5in&lt;/MarginLeft>" +
                      "  &lt;MarginRight>0.5in&lt;/MarginRight>" +
                      "  &lt;MarginBottom>0.5in&lt;/MarginBottom>" +
                      "&lt;/DeviceInfo>";

ㄟ...好像太長了...

回應 6
檢舉

看更多先前的回應...收起先前的回應...

外獅佬 iT邦大師 1 級 ‧ 2012-08-14 10:02:58 檢舉

LocalReport localReport = new LocalReport() { ReportPath = Server.MapPath("~/Reports/Report1.rdlc") };
這一行的目的，是載入rdlc報表

外獅佬 iT邦大師 1 級 ‧ 2012-08-14 10:05:31 檢舉

ReportDataSource reportDataSource = new ReportDataSource("DataSet1", GetProducts());

這個是載入報表的資料來源，GetProducts是自己寫的一個method，傳回List<Models.Products>，這個部分，可以依需求自己寫，或把整理好的dataset傳遞給報表。

外獅佬 iT邦大師 1 級 ‧ 2012-08-14 10:07:28 檢舉

string mimeType,encoding,fileNameExtension;
Warning[] warings;
String[] streams;
byte[] renderedBytes;

這些，是用來承接LocalReport傳出的參數資料
LocalReport類別

外獅佬 iT邦大師 1 級 ‧ 2012-08-14 10:14:38 檢舉

string deviceInfo = "<DeviceInfo>" +
" <OutputFormat>PDF</OutputFormat>" +
" <PageWidth>11...(恕刪)

這一段很重要...這是設定報表格式的部份
這裡使用Report Service的XML格式，設定報表的樣式
參考資料

外獅佬 iT邦大師 1 級 ‧ 2012-08-14 10:15:53 檢舉

<OutputFormat>PDF</OutputFormat>

指定rdlc輸出格式為PDF

外獅佬 iT邦大師 1 級 ‧ 2012-08-14 10:17:08 檢舉

PDF格式的DeviceInfo設定值，請參考

登入發表回應

外獅佬

iT邦大師 1 級 ‧ 2012-08-14 10:24:19

接續上面的code

&lt;pre class="c" name="code">
  renderedBytes = localReport.Render(reportType, deviceInfo, out mimeType, out encoding, out fileNameExtension, out streams, out warings);
  Response.Clear();
  Response.ContentType = mimeType;
  Response.AddHeader("content-disposition", "attachment; filename=report." + fileNameExtension);
  Response.BinaryWrite(renderedBytes);
  Response.End();
  return View();
}

回應 2
檢舉

外獅佬 iT邦大師 1 級 ‧ 2012-08-14 10:24:50 檢舉

renderedBytes = localReport.Render(reportType, deviceInfo, out mimeType, out encoding, out fileNameExtension, out streams, out warings);

這一行，輸出報表...

外獅佬 iT邦大師 1 級 ‧ 2012-08-14 10:26:49 檢舉

Response.AddHeader("content-disposition", "attachment; filename=report." + fileNameExtension);

這裡加上attachment，主要是讓user下載PDF檔，因為...避免因為user端未安裝PDF reader造成問題

登入發表回應

外獅佬

iT邦大師 1 級 ‧ 2012-08-14 10:30:45

參考資料

回應 1
檢舉

外獅佬 iT邦大師 1 級 ‧ 2012-08-14 10:40:15 檢舉

使用這種方式，務必記得，要把上述兩個dll檔一併發佈到web server上，
最簡單的方式，就是...在server上安裝...Microsoft 報表檢視器 2010 SP1 可轉散發套件

登入發表回應

外獅佬

iT邦大師 1 級 ‧ 2012-08-14 10:32:46

當然，搭配Microsoft Report還有其他作法。
最簡單的就是把傳統ASP.Net WebForm的網頁，加到MVC的routing
這樣的作法有個好處，就是user可以透過ReportViewer線上檢視、列印報表，如同傳統的WebForm一般。
偶個人認為，沒有哪個比較好或不好，只是分享一下自己實作的心得而已～