在 .NET 中使用 JsReport 将 HTML 转换为 PDF

作者:微信公众号:【架构师老卢】
4-27 8:17
25

概述:在这篇文章中,我将展示如何使用 JsReport 将 HTML 代码转换为 PDF,JsReport 是一个基于 JavaScript 的报告库,可以轻松集成到 .NET 项目中。JsReport 支持使用动态数据和功能(如图形、表格和图像)从 HTML、CSS 和 JavaScript 模板创建自定义报告。先决条件Visual Studio 2022包装:jsreport.AspNetCorejsreport.Binaryjsreport.Binary.Linuxjsreport.Local应用程序接口第一步是配置 program.cs 类:var builder = WebApplicat

在这篇文章中,我将展示如何使用 JsReport 将 HTML 代码转换为 PDF,JsReport 是一个基于 JavaScript 的报告库,可以轻松集成到 .NET 项目中。

JsReport 支持使用动态数据和功能(如图形、表格和图像)从 HTML、CSS 和 JavaScript 模板创建自定义报告。

先决条件

Visual Studio 2022

包装

jsreport.AspNetCore
jsreport.Binary
jsreport.Binary.Linux
jsreport.Local

应用程序接口

第一步是配置 program.cs 类:

var builder = WebApplication.CreateBuilder(args);  
builder.AddSerilog(builder.Configuration, "Sample JsReport");  
Log.Information("Starting API");  
  
builder.Services.AddRouting(options => options.LowercaseUrls = true);  
builder.Services.AddControllers();  
builder.Services.AddEndpointsApiExplorer();  
builder.Services.AddSwaggerGen();  
  
builder.AddJsReport();  
  
var app = builder.Build();  
  
if (app.Environment.IsDevelopment())  
{  
    app.UseSwagger();  
    app.UseSwaggerUI();  
}  
  
app.UseHttpsRedirection();  
  
app.UseAuthorization();  
  
app.MapControllers();  
  
app.Run();

该扩展负责将 JsReport 依赖项注入到解决方案中:AddJsReport()

public static class JsReportExtensions  
{  
 public static WebApplicationBuilder AddJsReport(this WebApplicationBuilder builder)  
 {  
  var localReporting = new LocalReporting()  
   .UseBinary(RuntimeInformation.IsOSPlatform(OSPlatform.Linux) ?  
      jsreport.Binary.Linux.JsReportBinary.GetBinary() :  
      jsreport.Binary.JsReportBinary.GetBinary())  
   .KillRunningJsReportProcesses()  
   .Configure(cfg =>  
   {  
    cfg.ReportTimeout = 60000;  
    cfg.Chrome = new ChromeConfiguration  
    {  
     Timeout = 60000,  
     Strategy = ChromeStrategy.ChromePool,  
     NumberOfWorkers = 3  
    };  
    cfg.HttpPort = 3000;  
    return cfg;  
   })  
   .AsUtility()  
   .Create();  
  
  builder.Services.AddJsReport(localReporting);  
  
  return builder;  
 }  
}

此代码使用 NuGet 包自动下载的 JsReport 二进制文件创建转换器的本地实例。

  • KillRunningJsReportProcesses()方法负责终止/释放以前的 PDF 生成过程中的内存。
  • Configure()方法负责 JsReport 的其他配置,在本例中,配置要在 Chrome 浏览器中处理的 PDF 生成。
  • AsUtility()method 表示我们将使用 JsReport 作为实用工具,而不存储模板或生成的报告。
  • Create()方法完成 JsReport 配置。

现在,我们可以使用 JsReport 进行转换。为此,有必要在 Controller 中创建一个方法,该方法接收 HTML 作为参数并返回 PDF 文件作为结果:

[ApiController]
[Route("[controller]")]
public class ConverterHtml : ControllerBase
{
 private readonly IRenderService _render;

 public ConverterHtml(IRenderService render)
 {
  _render = render;
 }

 [HttpPost]
 public async Task<IActionResult> Convert([FromForm] string html)
 {
  var report = await _render.RenderAsync(new RenderRequest
  {
   Template = new Template
   {
    Recipe = Recipe.ChromePdf,
    Engine = Engine.JsRender,
    Content = html
   }
  });
  
  return File(report.Content, "application/pdf", "file.pdf");
 }
}

该方法接收一个 RenderRequest 对象,该对象包含有关模板和报表格式的信息。在我们的例子中,模板是我们作为参数收到的 HTML。最后,我们使用该方法将此内容作为 PDF 文件返回。RenderAsync()File

测试

为了测试我们的方法,我们可以创建一个包含一些文本和图像的简单 HTML。例如:

<html>
<head>
    <style>
        h1 {
            color: blue;
        }
    </style>
</head>
<body>
    <h1>Converting HTML to PDF with JsReport in .NET</h1>
    <p>This is a cool example of how to convert HTML to PDF using JsReport in .NET.</p>
    <img src="https://raw.githubusercontent.com/dotnet/brand/main/logo/text-only/Black/dotnet-logo-text_Black%402x.png" alt=".NET logo" width="323" height="121">
</body>
</html>

然后,在调用 api/converterhtml 端点时将 HTML 作为参数传递,然后单击执行:

生成 PDF 文件的结果是什么:

使用 JsReport,在保持格式和图像的同时将 HTML 代码转换为 PDF 变得更加简单。我们可以使用更复杂的模板,并在报表中添加更多功能,例如页眉、页脚、页码等。

相关留言评论
昵称:
邮箱:
阅读排行