如何在iframe中调试Blazor WASM?

问题描述

当Blazor WASM由ASP.NET Core托管并驻留在iframe中时,调试器将无法工作。 例如,我有以下HTML的Page1:

<app>Loading...</app>
<div id="blazor-error-ui">
    An unhandled error has occurred.
    <a href="" class="reload">Reload</a>
    <a class="dismiss">?</a>
</div>
<script src="_framework/blazor.webassembly.js"></script>

和Page2,这会将Page1放入iframe:

<iframe src="/Page1" width="800" height="600">
</iframe>

在这种情况下:

  • 如果打开了Page1应用程序并且调试器按检查正常工作。
  • 如果打开Page2,则应用程序运行正常,但调试器无法运行:断点不起作用。 Chromium开发工具的调试也无法正常工作,并显示以下错误
No inspectable pages found
The list of targets returned by http://127.0.0.1:9222/json contains no entries matching the URL https://localhost:44329/.
Make sure your browser is displaying the target application.

http://127.0.0.1:9222/json

[ {
   "description": "","devtoolsFrontendUrl": "/devtools/inspector.html?ws=127.0.0.1:9222/devtools/page/8B7C4E90151A1A8A3F9D2D8FD93130D6","id": "8B7C4E90151A1A8A3F9D2D8FD93130D6","title": "New Tab","type": "page","url": "http://127.0.0.1:9222/json","webSocketDebuggerUrl": "ws://127.0.0.1:9222/devtools/page/8B7C4E90151A1A8A3F9D2D8FD93130D6"
},{
   "description": "","devtoolsFrontendUrl": "/devtools/inspector.html?ws=127.0.0.1:9222/devtools/page/DD0B85D174E30BF9E688213D52A312BD","id": "DD0B85D174E30BF9E688213D52A312BD","title": "127.0.0.1:52977/?url=https%3A%2F%2Flocalhost%3A44329%2F","url": "http://127.0.0.1:52977/?url=https%3A%2F%2Flocalhost%3A44329%2F","webSocketDebuggerUrl": "ws://127.0.0.1:9222/devtools/page/DD0B85D174E30BF9E688213D52A312BD"
},"devtoolsFrontendUrl": "/devtools/inspector.html?ws=127.0.0.1:9222/devtools/page/CD68FDE522F1DCDE6D3B49DF4872CE26","faviconUrl": "https://localhost:44329/favicon.ico","id": "CD68FDE522F1DCDE6D3B49DF4872CE26","title": "BlazorApp","url": "https://localhost:44329/Frame","webSocketDebuggerUrl": "ws://127.0.0.1:9222/devtools/page/CD68FDE522F1DCDE6D3B49DF4872CE26"
},"devtoolsFrontendUrl": "/devtools/inspector.html?ws=127.0.0.1:9222/devtools/page/6D57386F9C6D65737DF416657993C190","id": "6D57386F9C6D65737DF416657993C190","title": "McAfee DLP Endpoint Chrome Extension","type": "background_page","url": "chrome-extension://hddjhjcbioambdhjejhdlobijkdnbggp/_generated_background_page.html","webSocketDebuggerUrl": "ws://127.0.0.1:9222/devtools/page/6D57386F9C6D65737DF416657993C190"
} ]

具有最少代码可复制的存储库:https://github.com/GTmAster/blazor-iframe-debug

如何调试iframe中托管的Blazor WASM?

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)