ERR_SSL_PROTOCOL_ERROR 从不同机器访问 webpack DevServer 子 URL 时
ERR_SSL_PROTOCOL_ERROR when accessing webpack DevServer sub-URLs from a different machine
我正在尝试从虚拟机访问使用 webpack DevServer 服务的 Web 应用程序,但我只能通过 HTTPS 连接到主 URL - 所有子 URLs 失败并出现 ERR_SSL_PROTOCOL_ERROR
错误。
这是我的设置:
我是 运行 webpack DevServer,在装有 macOS 的主机上。我的虚拟机是 运行 Windows 10(桥接网络模式下的 VMware Fusion)。 Webpack DevServer 使用自定义自签名 SSL 证书(使用 mkcert
tool)生成。
这是我的 DevServer 配置 (@angular-builders/custom-webpack:dev-server
):
"builder": "@angular-builders/custom-webpack:dev-server",
"options": {
"browserTarget": "admin:build",
"allowedHosts": [
"localhost",
"admin.local.slido-staging.com"
],
"host": "0.0.0.0",
"port": 443,
"servePath": "/",
"ssl": true,
"sslCert": "ssl/server.crt",
"sslKey": "ssl/server.key"
},
(local.slido-staging.com
只是localhost
的一个“DNS别名”,由于内部需要,所以开发证书也为*.local.slido-staging.com
生成)。
为了让虚拟机也可以通过 HTTPS 访问 Web 应用程序,我从主机导出了根证书颁发机构(由 mkcert
生成),将其导入到根证书颁发机构存储在VM Windows 机器并将 192.168.2.90 admin.local.slido-staging.com
添加到我的 Windows hosts
文件(192.168.2.90 是我主机的 IP 地址)。
问题:
Web 应用程序完全可以从主机访问 - HTTPS 适用于主要 URL admin.local.slido-staging.com
和子 URLs(例如 admin.local.slido-staging.com\main.js
,看截图:
但是,当我尝试从 VM 访问它时,只有主要 URL (admin.local.slido-staging.com
) 通过 HTTPS 加载,所有其他 sub-URLs/resources 最终以 ERR_SSL_PROTOCOL_ERROR
:
这是另一件奇怪的事情 - 尝试通过输入主机的 IP 地址而不是主机名来从 VM 访问任何子 URLs(启动 HTTPS 连接,尽管证书与预期的 name/IP 地址不匹配),但尝试通过主机名访问它失败(忽略最后一个屏幕截图中的 4443 端口 - 我只是试图从不同的端口提供应用程序):
可能是什么问题?我花了几个小时调试它,但没有成功(我也尝试了 DevServer 的 -disable-host-check
参数,但没有帮助)
更新:
我尝试使用 HTTP 而不是 HTTPS 为应用程序提供服务,它在 Web 浏览器中也不起作用 - 只是错误消息从 ERR_SSL_PROTOCOL_ERROR
更改为 ERR_INVALID_HTTP_RESPONSE
。但是 Wireshark 显示已获取一些数据
此问题是由主机上安装的最新版本 Cisco AnyConnect Secure Mobility Client (4.10) 引起的。将 Cisco AnyConnect 软件降级到版本 4.9 后一切正常。
我正在尝试从虚拟机访问使用 webpack DevServer 服务的 Web 应用程序,但我只能通过 HTTPS 连接到主 URL - 所有子 URLs 失败并出现 ERR_SSL_PROTOCOL_ERROR
错误。
这是我的设置:
我是 运行 webpack DevServer,在装有 macOS 的主机上。我的虚拟机是 运行 Windows 10(桥接网络模式下的 VMware Fusion)。 Webpack DevServer 使用自定义自签名 SSL 证书(使用 mkcert
tool)生成。
这是我的 DevServer 配置 (@angular-builders/custom-webpack:dev-server
):
"builder": "@angular-builders/custom-webpack:dev-server",
"options": {
"browserTarget": "admin:build",
"allowedHosts": [
"localhost",
"admin.local.slido-staging.com"
],
"host": "0.0.0.0",
"port": 443,
"servePath": "/",
"ssl": true,
"sslCert": "ssl/server.crt",
"sslKey": "ssl/server.key"
},
(local.slido-staging.com
只是localhost
的一个“DNS别名”,由于内部需要,所以开发证书也为*.local.slido-staging.com
生成)。
为了让虚拟机也可以通过 HTTPS 访问 Web 应用程序,我从主机导出了根证书颁发机构(由 mkcert
生成),将其导入到根证书颁发机构存储在VM Windows 机器并将 192.168.2.90 admin.local.slido-staging.com
添加到我的 Windows hosts
文件(192.168.2.90 是我主机的 IP 地址)。
问题:
Web 应用程序完全可以从主机访问 - HTTPS 适用于主要 URL admin.local.slido-staging.com
和子 URLs(例如 admin.local.slido-staging.com\main.js
,看截图:
但是,当我尝试从 VM 访问它时,只有主要 URL (admin.local.slido-staging.com
) 通过 HTTPS 加载,所有其他 sub-URLs/resources 最终以 ERR_SSL_PROTOCOL_ERROR
:
这是另一件奇怪的事情 - 尝试通过输入主机的 IP 地址而不是主机名来从 VM 访问任何子 URLs(启动 HTTPS 连接,尽管证书与预期的 name/IP 地址不匹配),但尝试通过主机名访问它失败(忽略最后一个屏幕截图中的 4443 端口 - 我只是试图从不同的端口提供应用程序):
可能是什么问题?我花了几个小时调试它,但没有成功(我也尝试了 DevServer 的 -disable-host-check
参数,但没有帮助)
更新:
我尝试使用 HTTP 而不是 HTTPS 为应用程序提供服务,它在 Web 浏览器中也不起作用 - 只是错误消息从 ERR_SSL_PROTOCOL_ERROR
更改为 ERR_INVALID_HTTP_RESPONSE
。但是 Wireshark 显示已获取一些数据
此问题是由主机上安装的最新版本 Cisco AnyConnect Secure Mobility Client (4.10) 引起的。将 Cisco AnyConnect 软件降级到版本 4.9 后一切正常。