铯:使用自己的OpenStreetMap服务器.:“无法获取图像磁贴”错误

Cesium : Using own OpenStreetMap server. : 'Failed to obtain image tile' Error

本文关键字：图像 获取 错误 自己的 OpenStreetMap 服务器      更新时间：2023-09-26

按照指南，switch2osm.org 我能够运行自己的OSM磁贴服务器。

我确实使用webrowser验证了OSM磁贴服务器的状态。例如，在 http://localhost/osm_tiles/0/0/0.png 我得到小图片和世界。对我来说，Evertthing似乎在服务器端工作。

连接到在线地图源的铯也可以正常工作。

当我尝试将铯连接到本地OSM服务器时，问题弹出。在火狐控制台中，我收到此错误：

"中出错：无法获取图像磁贴 X：1 Y：1 级别：1。 铯.js：381：25514 "中发生错误：无法获取图像磁贴 X：1 Y：0 级别：1。 铯.js：381：25514 "中出错：无法获取图像磁贴 X：0 Y：0 级别：1。 铯.js：381：25514 "中发生错误：无法获取图像拼贴 X： 0 Y： 1 级别： 1." 铯.js：381：25514

我在这个问题上停留了几天。搜索网络没有为我提供任何有用的线索。

这是我运行铯的网页的源代码：

<!DOCTYPE html>
<html lang="en">
<head>
<!-- Use correct character set. -->
<meta charset="utf-8">
<!-- Tell IE to use the latest, best version (or Chrome Frame if pre-IE11). -->
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
<!-- Make the application on mobile take up the full browser screen and disable user scaling. -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<title>Hello World!</title>
<script src="../Build/Cesium/Cesium.js"></script>
<style>
  @import url(../Build/Cesium/Widgets/widgets.css);
  html, body, #cesiumContainer {
      width: 100%; height: 100%; margin: 0; padding: 0; overflow: hidden;
  }
</style>
</head>
<body>
<div id="cesiumContainer"></div>
<script>
//Initialize the viewer widget with several custom options and mixins.
var viewer = new Cesium.Viewer('cesiumContainer', {
//Hide the base layer picker
baseLayerPicker : false,
//Use OpenStreetMaps
imageryProvider : new Cesium.OpenStreetMapImageryProvider({
    url : 'http://localhost/osm_tiles/'
  //url : '//a.tile.openstreetmap.org/'
}),
// Show Columbus View map with Web Mercator projection
//    mapProjection : new Cesium.WebMercatorProjection()
});
//Add basic drag and drop functionality
viewer.extend(Cesium.viewerDragDropMixin);
//Show a pop-up alert if we encounter an error when processing a dropped file
viewer.dropError.addEventListener(function(dropHandler, name, error) {
console.log(error);
window.alert(error);
});
</script>
</body>
</html>

是否已在磁贴服务器上启用 CORS（跨源资源共享）？ 源定义为 URI 方案、主机名和端口号。 即使您的磁贴服务器和 Cesium 都在本地主机上运行，您也需要将服务器配置为提供 CORS 标头，以便 Cesium 使用图像。 有关如何在 osm apache 服务器上配置 CORS 的说明，请参阅 http://enable-cors.org/server_apache.html。

我仍然遇到这个问题（Cesium邮件列表中报告了同样的问题），我正在使用Python的SimpleHTTPServer来提供瓷砖。当我切换到支持 CORS 的网络服务器时，问题消失了。

真正令人困惑的是，原版 SimpleHTTPServer（非 CORS）正在打印来自 Cesium 的请求，其中包含 HTTP 200 成功代码，因此它似乎正在为 Cesium 的请求提供服务，但 Cesium 会报告您发现的错误。切换到 CORS 仍然是解决方案。

相关文章：