Edge(Chromium)IE模式下showModalDialog缩放级别丢失问题问询
传统Web应用缩放继承问题
问题场景
当终端用户通过Remote Desktop Connection访问站点时出现此问题:在Windows Server 2016/2019系统中,微软传统特性showModalDialog的缩放级别(screen.deviceXDPI)丢失,缩放被重置为默认的Ctrl+0级别。
根据微软官方文档,预期行为应为缩放级别被继承:
在Internet Explorer 9及更高版本中,使用window.open API(以及showModalDialog、showModelessDialog和createPopup)创建的窗口应始终从父页面继承缩放比例,不受‘重置新窗口和标签页的缩放级别’设置影响。
目前未找到对应的Edge或Internet Options设置,无错误提示,且IE11中无此问题。
环境配置
- 验证版本:Microsoft Edge 106.0.1370.47(官方64位版),自今年从IE11迁移后多版本均存在此问题
- 启用Edge IE模式以支持企业级向后兼容,站点配置如下:
<site url="localhost/SiteName"> <compat-mode>IE8Enterprise</compat-mode> <open-in>IE11</open-in> </site>
- 父窗口与模态窗口的主机、端口、HTTP协议一致,HTTP/HTTPS、localhost/域名环境均已验证
- 站点已加入Trusted Sites,未在Compatibility view Settings列表中
- Trusted sites未启用Protected mode
- 通过Remote Desktop Connection访问服务器浏览器
- 正常运行系统:Windows 10(1909)2个实例、Windows Server 2012 R2(9600)
- 出现问题系统:Windows Server 2019(1809)2个实例、Windows Server 2016(1607)
已尝试的解决方法
- 重置Internet Options高级设置
- 重置Edge默认设置
- 调整Internet Options中“重置新窗口和标签页的缩放级别”选项(勾选/不勾选均无效)
- 重新安装Edge
- 修改Zoom相关注册表项(对Edge IE模式无影响):
HKEY_CURRENT_USER\Software\Microsoft\Internet Explorer\ZoomComputer\HKEY_CURRENT_USER\Software\Classes\Local Settings\Software\Microsoft\Windows\CurrentVersion\AppContainer\Storage\microsoft.microsoftedge_8wekyb3d8bbwe\MicrosoftEdge\Zoom - 在不同分辨率显示器验证,Ctrl+0缩放为100%或200%时均存在问题
复现代码
父窗口HTML(注:此处ZoomLevel未转换为百分比)
<!doctype html> <html> <head> <title>Open Modal Dialog Test</title> <script type="text/javascript"> function ready(callback) { document.attachEvent('onreadystatechange', function () { if (document.readyState == 'complete') callback(); }); } ready(function () { var zoomLevel = screen.deviceXDPI / screen.logicalXDPI; document.getElementById("zoomLevel").innerHTML = zoomLevel; document.getElementById("deviceXDPI").innerHTML = screen.deviceXDPI; document.getElementById("logicalXDPI").innerHTML = screen.logicalXDPI; document.getElementById("systemXDPI").innerHTML = screen.systemXDPI; var ls_arguments = { zoomLevel: zoomLevel }; var url = "modalDialog2.htm?v=" + new Date(); window.showModalDialog(url, ls_arguments, "center:yes;dialogWidth:600px;dialogHeight:300px;status:yes;resizable=yes"); }); </script> </head> <body> Sample text Opener zoom: <div id="zoomLevel"></div> <p>deviceXDPI: <span id="deviceXDPI"></span></p> <p>logicalXDPI: <span id="logicalXDPI"></span></p> <p>systemXDPI: <span id="systemXDPI"></span></p> </body> </html>
模态窗口HTML
<!doctype html> <html> <head> <title>Modal Dialog</title> <script type="text/javascript"> function ready(callback) { document.attachEvent('onreadystatechange', function () { if (document.readyState == 'complete') callback(); }); } ready(function () { document.getElementById("zoomLevel").innerHTML = screen.deviceXDPI / screen.logicalXDPI; document.getElementById("zoomLevelParent").innerHTML = window.dialogArguments.zoomLevel; document.getElementById("deviceXDPI").innerHTML = screen.deviceXDPI; document.getElementById("logicalXDPI").innerHTML = screen.logicalXDPI; document.getElementById("systemXDPI").innerHTML = screen.systemXDPI; }); </script> </head> <body> Sample text <p>Modal zoom: <span id="zoomLevel"></span></p> <p>Opener zoom: <span id="zoomLevelParent"></span></p> <p>deviceXDPI: <span id="deviceXDPI"></span></p> <p>logicalXDPI: <span id="logicalXDPI"></span></p> <p>systemXDPI: <span id="systemXDPI"></span></p> </body> </html>
示例验证
示例1:Server 2019
父窗口缩放250%(状态栏显示),Edge显示缩放150%:
- deviceXDPI: 240
- logicalXDPI: 96
- systemXDPI: 192
模态窗口缩放参数:
- deviceXDPI: 192
- logicalXDPI: 96
- systemXDPI: 192
预期模态窗口deviceXDPI应为240。
示例2:Server 2016
通过示例代码可见,模态窗口deviceXDPI未继承父窗口的77,而同一机器上的IE11企业模式可正常继承缩放级别。
内容的提问来源于stack exchange,提问作者Sandis
相关产品推荐
相关产品推荐

