我制作了一个小的 xslt 文件来创建一个名为 weather.xsl 的 html 输出,代码如下:
<!-- DWXMLSource="http://weather.yahooapis.com/forecastrss?w=38325&u=c" -->
<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
exclude-result-prefixes="yweather"
xmlns:yweather="http://xml.weather.yahoo.com/ns/rss/1.0" xmlns:geo="http://www.w3.org/2003/01/geo/wgs84_pos#">
<xsl:output omit-xml-declaration="yes" indent="yes"/>
<xsl:strip-space elements="*"/>
<xsl:template match="/">
<img src="{/*/*/item/yweather:condition/@text}.jpg"/>
</xsl:template>
</xsl:stylesheet>
我想将 html 输出加载到 html 文件中的 div 中,我尝试使用 jQuery 执行如下操作:
<div id="result">
<script type="text/javascript">
$('#result').load('weather.xsl');
</script>
</div>
但我收到以下错误:Access-Control-Allow-Origin 不允许 Origin null。
我已经阅读了有关向 xslt 添加标头的信息,但我不知道该怎么做,所以任何帮助都将不胜感激,如果无法以这种方式加载 html 输出,请提供有关其他方法的建议这样做会很棒。
load
电话吗?根本就没有路吗?
Origin: null
) 访问外部资源(不同来源),这些外部资源应在响应标头中使用 "Access-Control-Allow-Origin": "*"
进行响应。
Origin null
是本地文件系统,因此这表明您正在加载通过 file:///
URL 进行 load
调用的 HTML 页面(例如,只需在本地文件浏览器或类似浏览器中双击它) .
大多数浏览器将 Same Origin Policy 应用于本地文件,甚至禁止从与文档相同的目录加载文件。 (以前是 Firefox 允许相同的目录和子目录,但是 not any longer.
基本上,将 ajax 与本地资源一起使用是行不通的。
如果您只是在本地测试您将真正部署到网络的东西,而不是使用本地文件,请安装一个简单的网络服务器并通过 http://
URL 进行测试。这为您提供了更准确的安全图片。您的 IDE 很可能内置了某种服务器(直接或通过扩展),让您只需在 IDE 中点击“运行”并启动服务器并提供文件。
Chrome 和 Safari 对使用本地资源的 ajax 有限制。这就是为什么它会抛出一个错误
Access-Control-Allow-Origin 不允许 Origin null。
解决方案:使用 Firefox 或将您的数据上传到临时服务器。如果您仍想使用 Chrome,请使用以下选项启动它;
--allow-file-access-from-files
有关如何将上述参数添加到 Chrome 的更多信息:右键单击任务栏上的 Chrome 图标,右键单击弹出窗口中的 Google Chrome,然后单击属性并将上述参数添加到快捷方式选项卡下的目标文本框中。它会如下所示;
C:\Users\XXX_USER\AppData\Local\Google\Chrome\Application\chrome.exe --allow-file-access-from-files
希望这会有所帮助!
/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --allow-file-access-from-files &
注意最后的 &只是为了让您可以继续使用终端,而不是必需的。 注意: 如果您关闭终端,它将关闭 Chrome 窗口。
只是想补充一点,“运行网络服务器”的答案似乎相当令人生畏,但如果你的系统上有 python(默认情况下至少安装在 MacOS 和任何 Linux 发行版上),它就像这样简单:
python -m http.server # with python3
或者
python -m SimpleHTTPServer # with python2
因此,如果您将 html 文件 myfile.html
放在一个文件夹中,例如 mydir
,您所要做的就是:
cd /path/to/mydir
python -m http.server # or the python2 alternative above
然后将浏览器指向:
http://localhost:8000/myfile.html
你完成了!适用于所有浏览器,无需禁用网络安全,允许本地文件,甚至使用命令行选项重新启动浏览器。
python -m SimpleHTTPServer 8080
我想根据这个 SO 来源谦虚地补充一点:https://stackoverflow.com/a/14671362/1743693,现在只需使用以下 jQuery 指令即可部分解决这种问题:
<script>
$.support.cors = true;
</script>
我在 IE10.0.9200 上尝试过,它立即工作(使用 jquery-1.9.0.js)。
在 chrome 28.0.1500.95 上 - 此指令不起作用(由于 david 在上面链接的评论中抱怨)
使用 --allow-file-access-from-files 运行 chrome 对我不起作用(正如 Maistora 上面的声明)
添加一点以使用 Gokhan 的解决方案:
--allow-file-access-from-files
现在您只需要在目标文本中附加上面的文本,后跟一个空格。确保在添加上述属性后关闭 chrome 浏览器的所有实例。现在通过添加此属性的图标重新启动 chrome。它应该适用于所有人。
我正在寻找一种从本地 html 文件向服务器发出 XHR 请求的解决方案,并找到了使用 Chrome 和 PHP 的解决方案。 (没有jQuery)
Javascript:
var x = new XMLHttpRequest();
if(x) x.onreadystatechange=function(){
if (x.readyState === 4 && x.status===200){
console.log(x.responseText); //Success
}else{
console.log(x); //Failed
}
};
x.open(GET, 'http://example.com/', true);
x.withCredentials = true;
x.send();
我的 Chrome 的请求标头 Origin: null
我的 PHP 响应标头(请注意,'null' 是一个字符串)。 HTTP_REFERER 允许从远程服务器跨域到另一个服务器。
header('Access-Control-Allow-Origin: '.(trim($_SERVER['HTTP_REFERER'],'/')?:'null'),true);
header('Access-Control-Allow-Credentials:true',true);
我能够成功连接到我的服务器。您可以忽略 Credentials 标头,但这适用于我启用 Apache 的 AuthType Basic
我测试了与 FF 和 Opera 的兼容性,它适用于许多情况,例如:
从 VM LAN IP (192.168.0.x) 返回到 VM 的 WAN(公共)IP:端口 从 VM LAN IP 返回到远程服务器域名。从本地 .HTML 文件到 VM LAN IP 和/或 VM WAN IP:端口,从本地 .HTML 文件到远程服务器域名。等等。
您可以使用源标记加载本地 Javascript 文件(在 file:/
源页面下方的树中):
<script src="my_data.js"></script>
如果您将输入编码为 Javascript,例如在这种情况下:
mydata.js:
$xsl_text = "<xsl:stylesheet version="1.0" + ....
(这对 json 来说更容易)然后你可以在 Javascript 全局变量中使用你的“数据”来随意使用。
不定期副业成功案例分享
$('#result').load('weather.xsl');
),则不应发生这种情况,因为请求显然来自同一来源。如果您尝试从其他地方加载(例如,$('#result').load('http://somewhere.else/weather.xsl');
),那么您将再次遇到 SOP,但方式不同。 Ajax 请求被限制在相同的 origin(请参阅答案中的链接),或者如果您使用的是启用 CORS 的浏览器并且服务器支持 COR,则服务器可以选择是否允许交叉-来源请求。python -m SimpleHTTPServer
,然后转到 localhost:8000,为我工作。 Mac OS X 预装了 Python;如果使用其他操作系统,您可能需要安装。