javascript - 查看源代码复制后 Leaflet Map JS 控制台出现问题

Question

从 View 源复制代码时，我在使用 Leaflet JS 映射时遇到问题:

根据我之前的问题:

Leaflet Map code copied from View-source: not working

看起来我需要一个网络服务器，

不幸的是，它也无法在本地主机中运行。

使用网络上的 javascript 代码后，我的控制台总是遇到很多问题。

我故意复制每一行代码，并考虑到任何链接。现在我不明白问题出在哪里。

在网络服务器中，某人的代码看起来很清晰，控制台也很清晰。

像这里:

https://harrywood.co.uk/maps/examples/leaflet/kml.html

一旦我复制驱动器上的所有内容并将其放入 Wampp 本地主机中，我的控制台中就会出现很多错误，如下图所示:

Access to XMLHttpRequest at 'file:///U:/Work/Leaflet/KML/LotA.kml' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https. KML.js:31 GET file:///U:/Work/Leaflet/KML/LotA.kml net::ERR_FAILED

代码 KML.js 在 Web 服务器上运行，与我的文件中的完全相同!

你能帮我解释一下吗？我可以在本地主机上运行它吗？

你知道如何正确复制代码吗？我忘记了什么东西？

Answer 1

您需要从控制台的网络选项卡下载 KML 文件，将其存储在本地，然后复制粘贴客户端代码。

请注意，此示例使用的是非常旧的传单版本，0.7.x

你可以看到下面的例子Demo

编辑:我在本地检查过，您对以前的图书馆的看法是正确的。我制作了一个似乎可以在本地使用传单杂食库来可视化 kml 的 plunker。我用 npm 的 serve 运行它似乎正在发挥作用。

var runLayer = omnivore.kml('test.kml').addTo(map).on('ready', function () {
    map.fitBounds(runLayer.getBounds());
});

备用 demo