我创建了一个小的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不允许使用null。
我已经读过有关向xslt添加标题的内容,但我不知道该怎么做,所以任何帮助都会受到赞赏,如果在html输出中加载不能这样做,那么建议如何做到这一点会很棒。
答案 0 :(得分:215)
原始null
是本地文件系统,因此建议您通过load
网址加载执行file:///
调用的HTML页面(例如,只需双击它在本地文件浏览器或类似的)。不同的浏览器采用不同的方法将Same Origin Policy应用于本地文件。
我的猜测是你使用Chrome看到这个。 Chrome将SOP应用于本地文件的规则非常严格,甚至不允许从与文档相同的目录中加载文件。 Opera也是如此。其他一些浏览器(如Firefox)允许对本地文件的有限访问。但基本上,使用带有本地资源的ajax不会跨浏览器工作。
如果您只是在本地测试一些您真正要部署到网络上的内容,而不是使用本地文件,请安装一个简单的Web服务器并通过http://
URL进行测试。这为您提供了更准确的安全图片。
答案 1 :(得分:212)
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
希望这会有所帮助!
答案 2 :(得分:40)
只想添加&#34;运行网络服务器&#34;答案似乎相当令人生畏,但如果您的系统上安装了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
你完成了!适用于所有浏览器,无需禁用Web安全性,允许本地文件,甚至可以使用命令行选项重新启动浏览器。
答案 3 :(得分:2)
我想谦虚地根据这个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上面提到的那样)
答案 4 :(得分:2)
添加一点使用Gokhan的解决方案:
--allow-file-access-from-files
现在您只需要在目标文本中的文本上方后跟空格。 确保在添加上述属性后关闭所有chrome浏览器实例。 现在,通过添加此属性的图标重新启动chrome。 它应该适用于所有人。
答案 5 :(得分:0)
我一直在寻找从本地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);
我能够成功连接到服务器。
您可以忽略凭据标头,但这在启用了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文件到远程服务器域名。
依此类推。
答案 6 :(得分:0)
您可以使用source标记加载本地Javascript文件(在file:/
源页面下方的树中):
<script src="my_data.js"></script>
如果您将输入编码为Javascript,例如这种情况:
mydata.js :
$xsl_text = "<xsl:stylesheet version="1.0" + ....
(对于json来说更容易),然后您就可以在Java全局变量中使用自己的“数据”。