javascript - 从数据:text/xml调用XSLT文件

Question

祝大家有美好的一天

我正在尝试从使用从 REST 获取的 data:text/xml 呈现的 XML 中调用 XSLT 文件。 最基本的尝试是使用这行代码:

window.open( 'data:text/xml,' + encodeURIComponent( responseData ) );

我的另一个尝试是在模态 iframe(带有 Angular-Material)中打开它，并使用 xml 数据设置 src，这两个测试都使用 URL 打开 XML，但出现此错误:

加载样式表时出错:未知错误(805303f4)

我在firefox和chrome下测试过，chrome的控制台错误详细信息更清晰:

不安全地尝试加载 URL route-to-xsl.xsl 从带有 URL 的框架 data:text/xml,。 .. 域、协议(protocol)和端口必须匹配。

我尝试使用样式表的绝对路径，包括相同的协议(protocol)、域等，但错误仍然存​​在(在 iframe 或新选项卡选项中)。

请帮忙，谢谢。

Answer 1

由于这是 Firefox 或 Chrome 等网络浏览器中的客户端 Javascript，我建议使用 XSLTProcessor 来执行 XSLT 转换，您可以使用 XMLHttpRequest< 拉入 XSLT 样式表，使用 DOMParser 解析您的 responseData，然后您可以使用 XSLTProcessor 进行转换。

我认为您不会让浏览器执行 data URL 中引用的 XSLT，除非 XSLT 本身作为数据嵌入:

var encodedXslt = 'data:application/xml,' + encodeURIComponent(document.getElementById('xslt').textContent);


var xmlCode = document.getElementById('xml').textContent;
var pi = '<?xml-stylesheet type="text/xsl" href="' + encodedXslt + '"?>';

var encodedXml = 'data:application/xml,' + encodeURIComponent(pi + xmlCode);

window.frames.xmlDisplay.location.href = encodedXml;

<script id="xslt" type="application/xml+xslt">
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
  <xsl:output method="html" indent="yes"/>
  <xsl:template match="list">
    <ul>
      <xsl:apply-templates/>
    </ul>
  </xsl:template>
  <xsl:template match="item">
    <li>
      <xsl:apply-templates/>
    </li>
  </xsl:template>
</xsl:stylesheet>
</script>

<script id="xml" type="application/xml">
  <list>
    <item>foo</item>
    <item>bar</item>
  </list>
</script>

<iframe name="xmlDisplay" width="100%" height="300"></iframe>

但是，似乎只有 Mozilla 接受了该尝试并应用了 XSLT，Chrome 继续提示不安全的尝试。因此，我认为使用 XSLTProcessor 将输入作为 Javascript 字符串来实现任何 XSLT 转换会更好、更可移植。