在使用WireMock代理第三方API时，若收到“We're sorry but isp-portal doesn't work properly without JavaScript enabled. Please enable it to continue”的HTML响应而非预期JSON，通常是由于代理目标配置错误。此问题源于将WireMock指向了需要JavaScript支持的用户界面（UI）前端域名，而非提供JSON数据的后端API域名。解决方案是精确识别并配置WireMock代理到正确的API服务地址。
WireMock代理API的常见挑战与解决方案
WireMock是一个功能强大的HTTP模拟工具，广泛应用于测试和开发阶段，通过模拟外部服务行为来隔离系统依赖。其代理模式（Proxy Mode）允许WireMock在记录或转发请求时充当中间人，将请求转发到实际的第三方服务，并可以选择性地记录响应以供后续模拟。然而，在配置代理时，一个常见的陷阱是错误地指向了服务的用户界面（UI）前端，而非其后端API接口，这可能导致收到非预期的HTML响应。
问题现象：收到“JavaScript未启用”的HTML响应
当尝试使用WireMock代理一个第三方API，并期望获得JSON格式的响应时，有时会意外地收到一个包含“We're sorry but isp-portal doesn't work properly without JavaScript enabled. Please enable it to continue”信息的HTML页面。这表明WireMock代理的请求被目标服务器识别为一个浏览器请求，并返回了需要JavaScript才能正常运行的Web前端页面，而不是预期的API数据。
以下是一个典型的操作流程及可能遇到的问题：
立即学习“前端免费学习笔记（深入）”；
-
直接调用第三方API（预期JSON响应） 首先，直接向第三方API发送请求，验证其返回预期的JSON数据。
curl -X GET "http://thrdpary.service.com/api/v2/requests/6396ff4eae78da7b0457f283" \ -H "authorization: Bearer mytoken" \ -H "accept: application/json"
此步骤通常会成功返回JSON响应。
-
启动WireMock代理服务 接着，启动WireMock作为代理，将所有请求转发到第三方服务。
java -jar ~/tools/wiremock/wiremock-jre8-standalone-2.35.0.jar --print-all-network-traffic \ --verbose \ --proxy-all https://thrdpary.service.com
这里 --proxy-all https://thrdpary.service.com 指定了WireMock将所有未匹配的请求转发到的目标地址。
-
通过WireMock代理调用API（意外HTML响应） 最后，通过WireMock的本地端口发送请求，期望WireMock将其转发到实际API并返回JSON。
curl -X GET "http://127.0.0.1:8080/api/v2/requests/6396ff4eae78da7b0457f283" \ -H "authorization: Bearer mytoken" \ -H "accept: application/json" -H "Content-Type: application/json"
然而，此时收到的却是如下所示的HTML响应，而非JSON数据：
<html lang="en"><head>...</head><body><noscript><strong>We're sorry but isp-portal doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div>...</body></html>
WireMock的日志也会显示其从目标服务器收到了 Content-Type: text/html 的响应。
根本原因分析
出现上述问题的原因在于对WireMock代理目标的配置不准确。 --proxy-all 参数后面跟随的URL https://thrdpary.service.com 实际上指向的是第三方服务的Web前端门户，而非其专门提供API服务的后端接口。许多现代Web应用采用前后端分离架构，前端（如 thrdpary.service.com）负责展示用户界面，通常需要浏览器环境和JavaScript支持；而后端API（如 api.thrdpary.service.com 或 thrdpary.service.com/api）则专门提供数据接口，返回JSON或其他机器可读格式的数据。
当WireMock将请求转发到前端门户时，门户服务器会将其视为普通浏览器请求，并返回包含前端应用代码（通常是HTML、CSS和JavaScript）的页面。由于 curl 这样的命令行工具不执行JavaScript，所以会显示“JavaScript未启用”的提示。
解决方案：精确指向API端点
解决此问题的关键在于将WireMock的代理目标精确地指向第三方服务的API端点。这通常意味着需要识别出API专用的子域名或路径。
例如，如果第三方服务的API地址是 https://api.thrdpary.service.com，那么正确的WireMock启动命令应修改为：
java -jar ~/tools/wiremock/wiremock-jre8-standalone-2.35.0.jar --print-all-network-traffic \ --verbose \ --proxy-all https://api.thrdpary.service.com
通过将 --proxy-all 参数指向正确的API域名（例如 api.thrdpary.service.com），WireMock就能将请求转发到实际提供JSON响应的API服务，从而避免收到前端页面的HTML响应。
注意事项与最佳实践
- 区分UI和API域名/路径：在配置WireMock代理时，务必明确区分第三方服务的用户界面（UI）域名或路径与API服务（后端）域名或路径。API通常会有 api. 前缀的子域名，或者在主域名下有 /api/ 这样的路径。
- 验证目标URL：在启动WireMock代理之前，建议使用 curl 或浏览器直接访问 --proxy-all 指定的URL，确保它确实返回API数据，而不是前端页面。
- 本地代理HTTPS到远程HTTPS：WireMock在本地以HTTP方式运行代理时，完全可以成功代理远程的HTTPS服务。例如，http://127.0.0.1:8080 可以代理到 https://api.thrdpary.service.com，WireMock会负责处理HTTPS连接。
- 详细日志分析：在调试过程中，启用 --print-all-network-traffic 和 --verbose 参数非常有用。它们能提供WireMock收发请求和响应的详细日志，帮助分析问题是发生在WireMock与客户端之间，还是WireMock与目标服务之间。
总结
当WireMock代理API时遇到“JavaScript未启用”的HTML响应，这并非WireMock本身的问题，而是代理目标配置不当的信号。核心解决方案是确保 --proxy-all 参数指向的是提供API服务的正确后端端点，而非需要浏览器渲染的Web前端。通过仔细检查和验证API的实际URL，可以有效解决此类代理配置错误，确保WireMock能正确地记录或转发API请求。
