如何使用 WebView2 使用 XSL 转换显示 XML 内容？

Question

我正在使用.Net Core 在 WPF 中创建一个应用程序，并且需要显示创作的 XML 内容。 我们使用其他软件将 xml 转换为 html 以进行在线托管。 但是，在创作时，我需要能够预览使用 xsl 文件转换的本地 XML 内容。 我正在使用 Linq 到 XML。

我首先在TabItem中创建一个WebView2控件。 使用预发布版本 1.0.790，我尝试使用SetVirtualHostNameToFolderMapping ，但没有成功。 我一开始只是尝试使用示例代码的复制粘贴打开一个通用的 html 文件，但只收到一条消息说 appassets.example 的 IP 无法解析。 我仔细检查了文件夹的位置以及该文件夹中的文件。

我的下一个尝试是使用NavigateToString并发送 xml。 这有几个问题。 首先是任何XProcessingInstruction都被转换为评论，我想这是一个安全功能？ 没有它，我看到的只是内部 xml 内容。 xml 更改为：

<?xml-stylesheet type="text/xsl" href="Template-xsl.xsl"?>

进入评论：

<!--?xml-stylesheet type="text/xsl" href="Template-xsl.xsl"?-->

另一个不相关的问题是，如果我添加一个InternalSubset ，webview 无法识别关闭]>我不确定这是否是 WebView 问题，所以我在 Notepad++ 中检查了它，它看起来是同一个问题。 我试过删除空格和换行符，但没有任何改变。 第一个实体似乎显示正常，但下一行始终是不同的颜色，这让我相信它以某种方式将第一个实体的结尾读取为结束 DocType。 DocType 的 XML 是：

<!DOCTYPE dmodule [
   <!ENTITY svg-test SYSTEM "svg-test.svg" NDATA svg >
   <!ENTITY svg-test1 SYSTEM "svg-test1.svg" NDATA svg >
]>

我开始只是创建一个字符串并更新InternalSubset 。 然后我尝试创建一个新的文档类型并插入与上述结果相同的文档类型。

string ent = Environment.NewLine;
                foreach (SVG s in sVGs)
                {
                    string en = "   <!ENTITY " + s.GraphicInfoEntityIdent + " SYSTEM \u0022" + s.FileName + "\u0022 NDATA svg >" + Environment.NewLine;
                    ent += en;
                }
                var doctype = new XDocumentType("dmodule", null, null, ent);
                xDoc.AddFirst(doctype);

我错过了什么，这是最好的方法吗？

编辑1：我认为浏览器只会处理转换，但显然不是这样。 根据 Martin 的建议，我返回并创建了一种新方法来转换 xml，然后再将其传递给 Webview。 这似乎有效，但我不断收到 xslt 编译错误。 它没有给我任何原因的迹象，所以我开始清理 xslt 脚本并找到了罪魁祸首。 我需要弄清楚如何让编译工作，因为没有它，转换将无法完全工作，但这是另一个问题。 浏览器将显示转换后的 xml 内容。

Answer 1

如果我在关注，你想

找到本地 XML 文件和本地 XSL 文件
使用 XSL 将 XML 转换为 HTML 并显示 HTML 结果

我从来没有在浏览器转换方面遇到过运气，所以我有一个不同的解决方案给你。 在您的 XPF 程序中运行转换并将 HTML 结果发送到浏览器。

使用您的 WPF 程序加载 XML、XSL 并转换为 HTML。 由于 WPF 程序是“本地”程序，因此它将对本地文件具有完全可见性。
在 WebView2 控件中加载一个特殊的 web 页面。 将您的 HTML 发布到 WebView2 window。 下面的示例，注释脚本，它从 XPF 程序中捕获消息。
在您的 WPF 程序中，将步骤 1 中的 HTML 发布到特殊的 web 页面。
最后，.JS 捕获消息 (HTML)，并用它更新页面。

这是特殊的 web 页面，它监听来自 XPF 程序的 HTML。

<html>
    <head>
    </head>
    <body>
        <div id='xformhtml'/>
    </body>

    <script type='text/javascript'>

    let xformDiv = document.querySelector( "#xformhtml );

    if( window.chrome.webview ) {
        window.chrome.webview.addEventListener( 'message', event => {
            xformDiv.innerHTML = event.data;
        });
    } else {
        xformDiv.innerHTML = "<h2>Sorry webview communication not supported.</h2>"
    }
    </script>
</html>

此链接显示如何与示例页面进行通信。

https://github.com/MicrosoftEdge/WebView2Feedback/issues/247

如何使用 WebView2 使用 XSL 转换显示 XML 内容？

问题描述

1 个解决方案

解决方案1
0 2021-02-17 20:49:45

如何使用 WebView2 使用 XSL 转换显示 XML 内容？

问题描述

1 个解决方案

解决方案1 0 2021-02-17 20:49:45

解决方案1
0 2021-02-17 20:49:45