.NET/C# Swagger响应体截断：解决UI卡顿问题

方案一：通过中间件截断Swagger预览的响应体 #

这种方式仅针对Swagger UI发起的请求截断响应内容，外部接口调用不受任何影响。

1. 创建自定义中间件类

public class SwaggerResponseTruncationMiddleware
{
    private readonly RequestDelegate _next;
    private readonly int _maxResponseLength;

    public SwaggerResponseTruncationMiddleware(RequestDelegate next, int maxResponseLength = 10000)
    {
        _next = next;
        _maxResponseLength = maxResponseLength;
    }

    public async Task InvokeAsync(HttpContext context)
    {
        // 识别Swagger UI请求：通过路径或Referer判断
        var isSwaggerRequest = context.Request.Path.StartsWithSegments("/swagger") || 
                               context.Request.Headers.TryGetValue("Referer", out var referer) && referer.ToString().Contains("/swagger");

        if (!isSwaggerRequest)
        {
            // 非Swagger请求直接放行
            await _next(context);
            return;
        }

        // 替换响应流用于后续修改内容
        var originalResponseBody = context.Response.Body;
        using var newResponseBody = new MemoryStream();
        context.Response.Body = newResponseBody;

        try
        {
            await _next(context);

            // 仅处理JSON格式的响应
            if (context.Response.ContentType?.Contains("application/json") == true)
            {
                newResponseBody.Seek(0, SeekOrigin.Begin);
                var responseContent = await new StreamReader(newResponseBody).ReadToEndAsync();

                if (responseContent.Length > _maxResponseLength)
                {
                    // 截断内容并添加提示
                    var truncatedContent = responseContent.Substring(0, _maxResponseLength) + "...\n\n[响应内容已截断，完整数据请通过外部工具调用接口获取]";
                    var truncatedBytes = Encoding.UTF8.GetBytes(truncatedContent);

                    // 更新响应内容和长度
                    context.Response.ContentLength = truncatedBytes.Length;
                    originalResponseBody.Seek(0, SeekOrigin.Begin);
                    await originalResponseBody.WriteAsync(truncatedBytes);
                }
                else
                {
                    // 内容未超限，直接返回原内容
                    newResponseBody.Seek(0, SeekOrigin.Begin);
                    await newResponseBody.CopyToAsync(originalResponseBody);
                }
            }
            else
            {
                // 非JSON响应直接返回原内容
                newResponseBody.Seek(0, SeekOrigin.Begin);
                await newResponseBody.CopyToAsync(originalResponseBody);
            }
        }
        finally
        {
            context.Response.Body = originalResponseBody;
        }
    }
}

2. 注册中间件
   在Program.cs中，将自定义中间件注册在Swagger相关中间件之前：

var builder = WebApplication.CreateBuilder(args);

// 其他服务注册逻辑...

builder.Services.AddSwaggerGen();

var app = builder.Build();

// 注册响应截断中间件，可自定义最大显示长度
app.UseMiddleware<SwaggerResponseTruncationMiddleware>(maxResponseLength: 15000);

if (app.Environment.IsDevelopment())
{
    app.UseSwagger();
    app.UseSwaggerUI();
}

// 其他中间件配置...

app.Run();

方案二：修改Swagger UI前端渲染逻辑 #

通过自定义JS脚本拦截响应体渲染过程，直接在前端截断内容。

1. 配置Swagger UI注入自定义脚本
   在Program.cs的Swagger UI配置中添加脚本注入：

app.UseSwaggerUI(options =>
{
    options.InjectJavascript("/swagger-custom.js");
});

2. 创建前端脚本文件
   在项目wwwroot目录下新建swagger-custom.js，写入以下代码：

window.onload = function() {
    // 覆盖原有的响应渲染函数
    const originalRenderResponse = window.ui.components.models.Response.render;
    window.ui.components.models.Response.render = function(props) {
        const result = originalRenderResponse(props);
        // 定位响应内容元素
        const responseContent = result.querySelector('.response-content');
        if (responseContent && responseContent.textContent.length > 10000) {
            // 截断内容并添加提示
            responseContent.textContent = responseContent.textContent.substring(0, 10000) + "...\n\n[响应内容已截断，完整数据请通过外部工具调用接口获取]";
        }
        return result;
    };
};

注意事项 #

• 两种方案的截断长度可根据实际需求调整，建议设置在10000-20000字符区间，平衡预览体验和性能。
• 中间件方案无需额外配置静态文件，前端方案需确保swagger-custom.js能被Swagger UI正确访问。
• 两种方案均不会影响外部接口调用，仅修改Swagger UI内展示的响应内容。

内容的提问来源于stack exchange，提问作者Kaito-kid