.NET Core 6 Web API中Rotativa动态报表表格布局异常求助

针对你用.NET Core 6 Web API + Rotativa动态生成HTML表格转PDF出现的布局异常，结合Rotativa基于wkhtmltopdf的特性，从以下几个方向排查解决：

1. 确保动态生成的HTML结构完整规范 #

Rotativa依赖完整的HTML文档结构，动态拼接时容易遗漏关键标签，导致渲染异常：

• 必须添加<!DOCTYPE html>声明
• 完整包含<html>、<head>、<body>标签
• CSS样式建议内联写入<head>，避免外部CSS加载问题（wkhtmltopdf对外部资源的支持有限）

示例完整结构模板：

var htmlContent = @"<!DOCTYPE html>
<html>
<head>
    <meta charset='UTF-8'>
    <style>
        /* 表格核心样式 */
        table {
            width: 100%;
            border-collapse: collapse;
            page-break-inside: avoid; /* 禁止表格跨页断裂 */
        }
        th, td {
            border: 1px solid #000;
            padding: 8px;
            text-align: left;
            word-wrap: break-word; /* 长文本自动换行 */
            -webkit-print-color-adjust: exact; /* 确保颜色/边框渲染准确 */
        }
        th {
            background-color: #f2f2f2;
        }
    </style>
</head>
<body>
    <h1>报表标题</h1>
    " + BuildDynamicTable(data) + @"
</body>
</html>";

2. 修正动态表格拼接的代码错误 #

动态拼接时容易出现标签未闭合、属性缺失等语法问题，导致布局混乱：

• 检查所有<tr>、<td>标签是否成对闭合
• 确保属性值添加引号（比如class='xxx'而非class=xxx）
• 避免拼接空内容或未处理的null值，可在拼接前过滤无效数据

示例安全的表格拼接方法：

private string BuildDynamicTable(List<YourDataModel> data)
{
    if (data == null || !data.Any())
        return "<p>无数据</p>";
    
    var tableBuilder = new StringBuilder();
    tableBuilder.Append("<table>");
    // 表头
    tableBuilder.Append("<tr><th>字段1</th><th>字段2</th><th>字段3</th></tr>");
    // 数据行
    foreach (var item in data)
    {
        tableBuilder.AppendFormat("<tr><td>{0}</td><td>{1}</td><td>{2}</td></tr>",
            HtmlEncode(item.Field1), // 必须HTML编码，防止特殊字符破坏结构
            HtmlEncode(item.Field2),
            HtmlEncode(item.Field3));
    }
    tableBuilder.Append("</table>");
    return tableBuilder.ToString();
}

// 辅助方法：HTML编码特殊字符
private string HtmlEncode(string value)
{
    return System.Web.HttpUtility.HtmlEncode(value ?? string.Empty);
}

3. 调整Rotativa生成PDF的配置参数 #

Rotativa的默认配置可能不适合复杂表格，可通过以下参数优化：

• 设置PageSize为合适的尺寸（比如Size.A4）
• 开启PageOrientation为Orientation.Landscape（如果表格列较多）
• 添加CustomSwitches指定wkhtmltopdf的高级参数，比如禁用缓存、调整缩放

示例Rotativa调用代码：

return new ViewAsPdf
{
    HtmlContent = htmlContent,
    PageSize = Size.A4,
    PageOrientation = Orientation.Landscape,
    CustomSwitches = "--no-cache --zoom 1.0 --enable-javascript"
};

4. 针对wkhtmltopdf的特殊CSS适配 #

如果以上步骤无效，添加wkhtmltopdf专属的CSS规则：

• 对于长表格，添加thead { display: table-header-group; }确保表头在每页重复
• 避免使用float布局，wkhtmltopdf对浮动的支持不佳，改用table或flex（flex需测试兼容性）
• 设置body { margin: 0; padding: 10px; }消除默认边距导致的布局偏移

内容的提问来源于stack exchange，提问作者BraianWenger