Json 文件未显示在 google chrome 中

Question

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

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

XMLHttpRequest cannot load file:///C:/AppServ/www/PFEleaflet/test%20geojson/lot.json. Cross origin requests are only supported for protocol schemes: http, data, 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。在属性 window 中，将以下内容添加到目标属性（引号外）：

--allow-file-access-from-files

这应该导致目标属性看起来像这样：

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

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

注意：我不建议更改原来的快捷方式或将其设为默认，因为启用后，任何页面都可以访问 file:/// 方案，而不是只是您机器上的页面。

Json 文件未显示在 google chrome 中

Json file dosen't show up in google chrome

jquery

json

google-chrome

leaflet