Question

我正在开发一个通过jQuery和Leaflet显示Json文件的页面。

Flickr端工作正常，但当我尝试$ .getJSON o时，我在Chrome控制台中看到一个错误：

XMLHttpRequest无法加载file：/// C：/AppServ/www/PFEleaflet/test%20geojson/lot.json。交叉源请求仅支持协议方案：http，数据，chrome，chrome-extension，https，chrome-extension-resource。

但是当我尝试在FireFox中打开.html页面时，Json文件显示出来，它运行正常。

这是我正在使用的代码：

var geoLayer = L.geoJson().addTo(map);
var geoList = L.control.geoJsonList(geoLayer);

geoList.on('item-active', function(e) {
    $('#selection').text(JSON.stringify(e.layer.feature.properties));
})
.addTo(map);

$('#geofile').on('change', function(e) {

    $.getJSON(this.value, function(json) {

        map.removeLayer(geoLayer);

        geoLayer = L.geoJson(json).addTo(map);
        map.fitBounds( geoLayer.getBounds() );

        geoList.reload( geoLayer );
    });
}).trigger('change');

请帮助。

Answer 1

建议在本地服务器上打开此页面而不是使用文件协议，这将导致此处和其他地方出现问题。 Nodejs服务很棒，或Ruby内置的http服务器。

这是一个很棒的清单。 https://gist.github.com/willurd/5720255

Answer 2

默认情况下，Chrome不允许任何页面访问file:///方案，即使该页面也在该方案中（在本地计算机上）。您可以通过向Google Chrome快捷方式添加参数来覆盖此默认设置，如下所示：

转到桌面并制作Google Chrome快捷方式的副本。右键单击快捷方式，然后单击Properties。在属性窗口中，将以下内容添加到目标属性（引号之外）：

--allow-file-access-from-files

这会导致目标属性如下所示：

"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --allow-file-access-from-files

现在关闭所有打开的Google Chrome窗口，确保没有chrome.exe进程正在运行。将文件拖到刚刚创建的新快捷方式上，页面应该启动并正常工作。

注意：我不建议更改原始快捷方式或将其设为默认快捷方式，因为启用此功能后，任何网页都可以访问file:///方案，而不仅仅是你的机器。

Json文件不会显示在谷歌浏览器中

2 个答案: