谷歌浏览器跨域问题

来源：互联网发布：梦幻西游网络错误编辑：程序博客网时间：2024/05/30 04:26

最近在做项目时候，用到借鉴easyUI框架的时候，在官网下载的表格冻结功能的时候，出现了json文件中json数据展示不到表格的问题，浏览器控制台报跨域的问题。官网和报错截图如下，

效果：

demo源码：

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><meta name="keywords" content="jquery,ui,easy,easyui,web"><meta name="description" content="easyui help you build your web page easily!"><title>jQuery EasyUI Demo</title><link rel="stylesheet" type="text/css" href="http://www.jeasyui.net/Public/js/easyui/themes/default/easyui.css"><link rel="stylesheet" type="text/css" href="http://www.jeasyui.net/Public/js/easyui/themes/icon.css"><script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js"></script><script type="text/javascript" src="http://www.jeasyui.net/Public/js/easyui/jquery.easyui.min.js"></script><!-- <link rel="stylesheet" type="text/css" href="css/easyui.css"><link rel="stylesheet" type="text/css" href="css/icon.css"><script type="text/javascript" src="js/jquery.min.js"></script><script type="text/javascript" src="js/jquery.easyui.min.js"></script> --></head><body><h1>Frozen Columns for DataGrid</h1><table id="tt" title="Frozen Columns" class="easyui-datagrid" style="width:500px;height:250px"url="data/datagrid_data.json"singleSelect="true" iconCls="icon-save"><thead frozen="true"><tr><th field="itemid" width="80">Item ID</th><th field="productid" width="80">Product ID</th></tr></thead><thead><tr><th field="listprice" width="80" align="right">List Price</th><th field="unitcost" width="80" align="right">Unit Cost</th><th field="attr1" width="150">Attribute</th><th field="status" width="60" align="center">Stauts</th></tr></thead></table></body></html>

分析：

点开左边的箭头，看看是什么js报的错。可能是因为，你用了第三方地址的js，然后第三方js里的ajax去请求你本地文件，就可能导致跨域。

解决方法：把它里面引用的第三方的js，都下载到本地引用。因为，ajax不能跨网站去请求其它地址的函数等，除非用jsonp 。

结果发现还是报XMLHttpRequest cannot load file:///T:/EasyUI/jeasyui-datagrid-datagrid5/data/datagrid_data.json. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.及是ajax跨域的问题。为了节省时间，在谷歌浏览器的属性里面设置改下就可以了，

打开Chrome快捷方式的属性中设置：

右击Chrome浏览器快捷方式，选择“属性”，

在“目标”中加上"--allow-file-access-from-files"，注意前面有个空格，

重启Chrome浏览器便可。

下面是别人的博客上 http://blog.csdn.net/dandanzmc/article/details/31344267/ 看的内容感觉不错，就留下了自己可以多看看。hh!

分析

一出现这个错误，我就猜到是加载.json文件的问题，先前，在做----的时候，就接触了Easyui，也接触了json，那时是将从数据库中返回的datatable中的数据转换为json数据，然后加载到表格中，所以，这个时候我最先想到的是json数据格式的原因，按照先前在的json数据格式改了后，仍然出现这个错误。当我把.json文件中的数据写到代码中时，加载正常。所以说这就不是json数据格式的原因了。

原因

这就让我不得不想想是否是其他的原因了，后来，通过一番查询，找到了原因。

原因如下：

Chrome不支持本地Ajax请求，当我在.html文件中访问.json文件时就会出现这个问题，就是说这个时候不能加载这个.html文件。

解决方式

打开Chrome快捷方式的属性中设置：

右击Chrome浏览器快捷方式，选择“属性”，

在“目标”中加上"--allow-file-access-from-files"，注意前面有个空格，

重启Chrome浏览器便可。

这样就正常加载了。

0 0