Xen*_*nos 6 javascript xml xslt google-chrome
短的:
XSLT 应用于 XML,我想使用document(http://...), 从另一个域而不是 XSL 和原始 XML加载另一个XML。我向服务器添加了 CORS 标头,它适用于 Firefox,而不是 Chrome。为什么,以及如何解决这个问题?
完整案例:
我首先使用 html5Rocks 示例尝试了 CORS 请求。所以我有一个 html 文档,http://localhost/cors.html其中包含以下代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>
</title>
<script>
function createCORSRequest(method, url)
{
var xhr = new XMLHttpRequest();
if ("withCredentials" in xhr)
{
// Check if the XMLHttpRequest object has a "withCredentials" property.
// "withCredentials" only exists on XMLHTTPRequest2 objects.
xhr.open(method, url, true);
}
else if (typeof XDomainRequest != "undefined")
{
// Otherwise, check if XDomainRequest.
// XDomainRequest only exists in IE, and is IE's way of making CORS requests.
xhr = new XDomainRequest();
xhr.open(method, url);
}
else
{
// Otherwise, CORS is not supported by the browser.
xhr = null;
}
return xhr;
}
function go()
{
console.log('go!');
var url = 'http://cors1.localhost/cors-data.xml';
var xhr = createCORSRequest('GET', url);
if (!xhr)
{
throw new Error('CORS not supported');
}
xhr.onload = function()
{
var responseText = xhr.responseText;
var responseXml = xhr.responseXML;
console.log(responseXml);
// process the response.
};
xhr.onerror = function()
{
console.log('There was an error!');
};
xhr.send();
}
document.addEventListener('DOMContentLoaded', go, false);
</script>
</head>
<body>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
在 firefox 上工作正常:XHR 对象发送 CORS 请求,浏览器和服务器都能很好地处理它,这要归功于以下服务器的 .htaccess 文件:
Header set Access-Control-Allow-Origin "*"
Header set Access-Control-Allow-Credentials "true"
Header set Access-Control-Allow-Methods "OPTIONS, GET, POST"
Header set Access-Control-Allow-Headers "Content-Type, Depth, User-Agent, X-File-Size, X-Requested-With, If-Modified-Since, X-File-Name, Cache-Control"
Run Code Online (Sandbox Code Playgroud)
现在,我在 Chrome 上测试它......没问题,它也能正常工作?在两种浏览器中,控制台都会显示 XHR 响应的内容(它的responseXml),所以我假设服务器配置良好(不是吗?)。
现在,我有一个 XML 文件:
<?xml version="1.0" encoding="utf-8"?>
<?xml-stylesheet type="text/xsl" href="CORS.xsl"?>
<cors source="http://cors1.localhost/CORS-data.xml"/>
Run Code Online (Sandbox Code Playgroud)
并在其上应用了 XSLT:
<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html" encoding="utf-8" indent="yes"/>
<xsl:template match="/cors">
<xsl:variable name="cors" select="document(@source)/cors"/>
<p>
<xsl:text>CORS-data.xml (</xsl:text>
<a href="{@source}">
<xsl:value-of select="@source"/>
</a>
<xsl:text>): </xsl:text>
<xsl:value-of select="$cors"/>
</p>
</xsl:template>
</xsl:stylesheet>
Run Code Online (Sandbox Code Playgroud)
因此 XSLT 应该加载一个外部文档 ( http://cors1.localhost/CORS-data.xml) 并显示其内容 ( <xsl:value-of select="$cors"/>)。它实际上在 Firefox 中做得很好,但在 Chrome 中却没有,控制台说:
Unsafe attempt to load URL http://cors1.localhost/CORS.xsl from frame with URL http://localhost/CORS.xml. Domains, protocols and ports must match.
和页面结果:
CORS-data.xml (http://cors1.localhost/CORS-data.xml):
之后应该有 document() 加载的 XML 内容(一个简单的“确定”),:但它是无效的。
我看到了几个关于此类问题的主题,但它们是关于file:///协议的,而不是关于http://. 我可以理解file:///出于安全原因不允许 XSLT,但我不明白
为什么 Chrome 的 CORS 可以与 javascript 的 XHR 一起使用,但无法使用 XSLT 的document()功能?以及如何解决这个问题?
小智 -1
Chrome 不允许 localhost 作为源,您应该尝试使用 --allow-file-access-from-files 和 --disable-web-security 标志启动 Chrome。