在文章 " 如何在 ASP.NET web API 中使用 FastReport.Net " 中,我们已经讨论了如何创建一个用于生成报表的 Web 服务.然后我们会收到报表的链接,现在我们来看看如何获?? 取报表并使用 ajax 脚本显示它.
让我提醒你一下,我们的服务可以返回以这些格式之一导出的报表:PDF,html,PNG.我们将以 HTML 格式接收报表,并使用 ajax 脚本将其显示在网页上.
我们接下来讲解一下从头开始创建 WebApi 应用程序的过程.首先,创建一个 ASP.Net 应用程序,WebAPI.选择空模板并勾选选项:MVC 和 WebApi.
在项目引用中,添加 FastReport.dll 库.
我们继续创建一个数据模型.现在 Model 文件夹是空的.点击右键并选择 "Add","Class".
将其命名为 Reports.cs.添加两个字段:Id 和 ReportName:
namespace FastReportWebApiDemo.Models
{
public class Reports
{
// Report ID
public int Id { get; set; }
// Report File Name
public string ReportName { get; set; }
}
}
你需要将报表模板和数据库文件放在 App_Data 文件夹中.在我们的例子中,我们把这两个报表放进去:"Simple List.frx" 和 "Barcode.frx";
现在,在 Controllers 文件夹中,添加控制器 ReportsController.它将包含应用程序的所有逻辑.我们使用 Controllers 文件夹的上下文菜单执行此操作.选择 "添加" - >"控制器":
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Net.Http;
using System.Web.Http;
using FastReport;
using FastReport.Export.Image;
using FastReport.Export.Html;
using FastReport.Export.Pdf;
using FastReport.Utils;
using FastReportWebApiDemo.Models;
using System.Web.Hosting;
using System.Data;
using System.IO;
using System.Net.Http.Headers;
namespace FastReportWebApiDemo.Controllers
{
// Transfer class with parameters for requesting a report
public class ReportQuery
{
// Format of resulting report: png, pdf, html
public string Format { get; set; }
// Value of "Parameter" variable in report
public string Parameter { get; set; }
// Enable Inline preview in browser (generates "inline" or "attachment")
public bool Inline { get; set; }
}
public class ReportsController : ApiController
{ //Reports list
Reports[] reportItems = new Reports[]
{
new Reports { Id = 1, ReportName = "Simple List.frx" },
new Reports { Id = 2, ReportName = "Barcode.frx" }
};
// Get list of reports
public IEnumerable<Reports> GetAllReports()
{
return reportItems;
}
// Get report by ID from request
public HttpResponseMessage GetReportById(int id, [FromUri] ReportQuery query)
{
// Find report
Reports reportItem = reportItems.FirstOrDefault((p) => p.Id == id);
if (reportItem != null)
{
string reportPath = HostingEnvironment.MapPath("~/App_Data/" + reportItem.ReportName);
string dataPath = HostingEnvironment.MapPath("~/App_Data/nwind-employees.xml");
MemoryStream stream = new MemoryStream();
try
{
using (DataSet dataSet = new DataSet())
{
// Fill the data source with the data
dataSet.ReadXml(dataPath);
// Enable FastReport web mode
Config.WebMode = true;
using (Report report = new Report())
{
report.Load(reportPath); // Load the report
report.RegisterData(dataSet, "NorthWind"); // Register the data in the report
if (query.Parameter != null)
{
report.SetParameterValue("Parameter", query.Parameter); // Set the value of the parameter in the report. The very meaning we take from the URL
}
// Two phases of preparation to exclude the display of any dialogs
report.PreparePhase1();
report.PreparePhase2();
if (query.Format == "pdf")
{
// Export the report to PDF
PDFExport pdf = new PDFExport();
// We use the stream to store the report so that we do not produce files
report.Export(pdf, stream);
}
else if (query.Format == "html")
{
// Export the report to HTML
HTMLExport html = new HTMLExport();
html.SinglePage = true;
html.Navigator = false;
html.EmbedPictures = true;
report.Export(html, stream);
}
else if (query.Format == "png")
{
// Export the report to PNG
using (ImageExport img = new ImageExport())
{
img.ImageFormat = ImageExportFormat.Png;
img.SeparateFiles = false;
img.ResolutionX = 96;
img.ResolutionY = 96;
report.Export(img, stream);
query.Format = "png";
}
}
else
{
WebReport webReport = new WebReport();// Create a report object
webReport.Report.Load(reportPath); // Load the report
webReport.Report.RegisterData(dataSet, "NorthWind"); // Register the data source in the report
if (query.Parameter != null)
{
webReport.Report.SetParameterValue("Parameter", query.Parameter); // Set the value of the report parameter
}
// inline registration of FastReport javascript
webReport.InlineRegistration = true; // Allows you to register scripts and styles in the body of the html-page instead of placing them in the title
webReport.Width = Unit.Percentage(100);
webReport.Height = Unit.Percentage(100);
// get control
HtmlString reportHtml = webReport.GetHtml(); // load the report into HTML
byte[] streamArray = Encoding.UTF8.GetBytes(reportHtml.ToString());
stream.Write(streamArray, 0, streamArray.Length); // Write the report to the stream
}
}
}
// create the resulting variable
HttpResponseMessage result = new HttpResponseMessage(HttpStatusCode.OK)
{
Content = new ByteArrayContent(stream.ToArray())
};
stream.Dispose();
result.Content.Headers.ContentDisposition =
new System.Net.Http.Headers.ContentDispositionHeaderValue(query.Inline ? "inline" : "attachment")
{
// Set the file extension depending on the type of export
FileName = String.Concat(Path.GetFileNameWithoutExtension(reportPath), ".", query.Format)
};
// Define the content type for the browser
result.Content.Headers.ContentType =
new MediaTypeHeaderValue("application/" + query.Format);
return result;
}
// Handle Exceptions
catch
{
return new HttpResponseMessage(HttpStatusCode.InternalServerError);
}
}
else
return new HttpResponseMessage(HttpStatusCode.NotFound);
}
}
}
在 ReportsController 类中,我们创建了一个报表数组和两个方法.名称和报表标识符在数组中定义.GetAllReports () 方法返回可用报表的列表.第二种方法
GetReportById (int id, [FromUri] ReportQuery query)
通过标识符返回一个报表.从查询属性中,我们可以得到参数格式,内联和参数.这三者分别决定:报表的导出格式,报表是否会直接在浏览器中打开,传递给报表的参数的值.特别有趣的是
webReport.GetHtml ()
方法,它可以让你获得报表的 HTML 视图.这就是我们使用 ajax 在页面上显示的内容.
在 Web.config 文件中,你需要添加两个处理句柄:
<handlers>
...
<add name="ExtensionlessUrlHandler-Integrated-4.0" path="*." verb="*" type="System.Web.Handlers.TransferRequestHandler" preCondition="integratedMode,runtimeVersionv4.0" />
<add name="FastReportHandler" path="FastReport.Export.axd" verb="*" type="FastReport.Web.Handlers.WebExport" />
...
</handlers>
现在添加网页.在项目上点击右键并选择 Add-> HTML Page.
一般我们习惯将起始页命名为 Index.将以下代码添加到页面中:
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
</head>
<body>
<script type="text/javascript" language="javascript">
function call() {
var msg = $('#formx').serialize();
$.ajax({
type: 'GET',// Type
url: 'http://localhost:58005/api/reports/1', // We receive a file from Rest service
cache: false,// Caching
timeout: 30000,// Timeout
data: msg,
success: function (data) {// The function will work if the data is successfully received
$('#results').html(data);// We display the data in the form },
beforeSend: function (data) {// The function is activated during the waiting period of data
$('#results').html('<p> Waiting for data...</p>');
},
dataType: "html", // Data type
error: function (data) {// Function will work if an error occurs
$('#results').html('<p> Failed to load report</p>');
}
});
}
</script>
<form method="GET" id="formx" action="javascript:void(null);" onsubmit="call()">
<input value="Загрузить" type="submit">
</form>
<div id="results" typeof="submit"></div><!-- Here the result will be displayed-->
</body>
</html>
从代码中可以看到,我们只是通过从服务链接请求来加载 HTML 报表文件.
从文件夹 App_Start 打开文件 WebApiConfig.cs.为 Index 页面添加一个 MapHttpRoute:
public static void Register(HttpConfiguration config)
{
// Web API configuration and services
// Web API routes
config.MapHttpAttributeRoutes();
config.Routes.MapHttpRoute(
name: "Index",
routeTemplate: "{id}.html",
defaults: new { id = "index" }
);
config.Routes.MapHttpRoute(
name: "DefaultApi",
routeTemplate: "api/{controller}/{id}",
defaults: new { id = RouteParameter.Optional }
);
}
在同一个文件夹中,找到 RouteConfig.cs 文件.它可以被删除.
打开文件 Global.asax.删除该行:
RouteConfig.RegisterRoutes(RouteTable.Routes);
现在路由只能通过 WebApiConfig 来完成.
运行该应用程序,然后单击 "下载" 按钮:
就这样,我们收到了报表.
从上面的例子可以清楚的看出,使用 Ajax 进行报表处理是非常简单的.
来源: http://www.bubuko.com/infodetail-2474116.html