如何使用JMeter将含图片的HTML响应保存至文件？

嘿，这个需求我刚好折腾过，给你一套可行的方案！默认情况下View Results Tree没法直接生成带自定义命名截图的HTML报告，但通过组合采样器配置和监听器设置，完全能实现你要的效果——让截图名称对应步骤名（比如TC002 Account Menu），还能嵌入到HTML响应里。

第一步：先让每个测试步骤生成对应名称的截图 #

首先得确保你的测试采样器（比如WebDriver Sampler，毕竟只有UI测试才会有屏幕截图）能生成以步骤名命名的截图。这里给你一段Groovy脚本示例，直接放到WebDriver Sampler里就行：

import org.openqa.selenium.OutputType;
import org.openqa.selenium.TakesScreenshot;
import java.io.File;
import org.apache.commons.io.FileUtils;

// 这里替换成你的步骤名称，比如TC002 Account Menu
def stepName = "TC002 Account Menu"
// 指定截图保存目录（建议放在JMeter的bin目录下的screenshots文件夹，提前创建好）
def screenshotDir = new File(JMeterUtils.getJMeterBinDir() + "/screenshots")
if (!screenshotDir.exists()) {
    screenshotDir.mkdirs()
}
// 生成并保存截图
File screenshot = ((TakesScreenshot) WDS.browser).getScreenshotAs(OutputType.FILE);
FileUtils.copyFile(screenshot, new File(screenshotDir, "${stepName}.png"));

这段代码会自动创建截图目录，并且把当前步骤的截图以你指定的步骤名保存下来。如果是批量测试，你可以把stepName换成变量（比如从User Defined Variables里取），这样每个步骤只需要改变量值就行，不用重复写代码。

第二步：让View Results Tree或HTML报告嵌入截图 #

View Results Tree本身的“Save Response as HTML”功能不会自动嵌入截图，但我们有两种方式实现：

方式一：用自定义HTML报告模板（批量测试推荐） #

这种方式适合大量测试用例，能自动生成带截图的完整HTML报告：

1. 打开JMeter的bin/jmeter.properties文件，添加以下配置，让报告生成器知道截图的位置：

# 指定截图存放目录
jmeter.reportgenerator.screenshot.dir=${jmeter.save.saveservice.output_dir}/screenshots
# 报告中引用截图的相对路径
jmeter.reportgenerator.screenshot.rel.path=./screenshots/

2. 找到JMeter的bin/report-template目录，修改detail.tpl（详情页模板），在采样器信息区域添加嵌入截图的代码：

{{#sample.screenshot}}
<div class="screenshot-section">
  <h4>步骤截图: {{sample.label}}</h4>
  <img src="{{sample.screenshot}}" alt="{{sample.label}}" style="max-width: 100%;">
</div>
{{/sample.screenshot}}

3. 运行测试后，用命令jmeter -g [结果文件路径] -o [报告输出目录]生成HTML报告，打开报告就能看到每个步骤对应的截图已经嵌入进去了，截图名称就是你设置的步骤名。

方式二：手动在View Results Tree中关联截图（少量测试用） #

如果你的测试用例不多，可以手动操作：

• 在View Results Tree里选中目标采样器，点击右上角的「Save Response as HTML」保存响应
• 找到你之前保存的对应步骤名的截图，用文本编辑器打开生成的HTML文件，插入<img src="你的截图路径" alt="TC002 Account Menu">代码，把截图嵌入进去。

第三步：优化技巧——封装截图逻辑 #

如果你有很多测试步骤，可以把截图逻辑封装成一个通用的Test Fragment，每次调用时传入步骤名称参数：

1. 创建一个Test Fragment，添加WebDriver Sampler，把截图脚本里的stepName换成${__P(stepName,)}（用JMeter的属性参数）
2. 在每个测试步骤前，用User Defined Variables或者BeanShell PreProcessor设置stepName的值为当前步骤名（比如TC002 Account Menu）
3. 用模块控制器引用这个Test Fragment，这样每个步骤只需要改参数，不用重复写截图代码，效率更高！

这样操作下来，你就能完美实现“保存包含对应步骤名称截图的HTML响应”的需求啦！

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