Angular加载ArcGIS Esri Web Map报fetch tile瓦片获取错误如何排查

报错原因 #

你遇到的mapview-query-error+request:server报错是ArcGIS JS API在请求图层瓦片/要素数据时服务端返回失败触发的，从你的代码来看核心诱因有3种：

• 你通过this.featureLayerUrl加载的ParcelAtlas外部FeatureLayer访问异常：要么是url填写错误，要么是你传入的esriToken没有该要素服务的访问权限，要么是该ArcGIS服务没有配置CORS跨域规则，导致前端请求被拦截。
• 你通过portalItem加载的WebMap本身包含的内置图层有权限/访问问题：如果该WebMap是你所在组织的私有Portal资源，或者内置了需要额外授权的付费图层，当前token没有对应访问权限就会触发批量瓦片请求失败。
• 自定义客户端FeatureLayer（dataFeedLayer）配置不完整、加载时机错误：
  1. 你没有给该自定义图层显式指定spatialReference，如果WebMap默认底图的空间参考为Web墨卡托（102100），和你传入的WGS84（4326）坐标不匹配，会触发瓦片查询错误
  2. 你在MapView实例创建完成后才添加dataFeedLayer，视图初始化渲染时触发的瓦片查询会找不到对应图层资源，导致报错。

修复方案 #

1. 先排查外部服务可用性：直接在浏览器地址栏打开this.featureLayerUrl的地址，带上token参数看是否能正常返回服务信息，确认url和权限没问题。
2. 调整图层加载逻辑，把所有图层添加到WebMap之后再初始化MapView：

initializeMap(esriToken) {
  const container = this.mapViewEl.nativeElement;
  config.apiKey = esriToken;
  esriConfig.request.timeout = 300000;
  const horizonData: any[] = this.esiriData || [];

  // 先构造所有图层
  const webmap = new WebMap({
    portalItem: {
      id: this.webMapId
    }
  });

  const parcelLayer = new FeatureLayer({
    url: this.featureLayerUrl,
  });
  webmap.add(parcelLayer);

  const renderer = new SimpleRenderer({
    symbol: new TextSymbol({
      color: "red",
      text: "\ue612",
      font: {
        size: 15,
        family: "CalciteWebCoreIcons"
      }
    })
  });

  const dataFeedLayer = new FeatureLayer({
    source: horizonData.map((d,i)=>(
      {
        geometry: new Point({
          longitude: d.longitude,
          latitude: d.latitude
        }),
        attributes: {
          ObjectID: i,
          ...d
        }
      }
    )),
    objectIdField: 'ObjectID',
    geometryType: "point",
    renderer: renderer,
    // 显式指定空间参考
    spatialReference: { wkid: 4326 }
  });
  webmap.add(dataFeedLayer);

  // 所有图层添加完成后再初始化MapView
  const view = new MapView({
    container,
    map: webmap,
    zoom: 4,
    center: [-97.63, 38.34],
  });

  this.view = view;
  return this.view.when();
}

3. 如果还是报错，可给FeatureLayer添加outFields: ["*"]配置，避免要素查询时字段权限不足导致请求失败。

内容的提问来源于stack exchange，提问作者Harsha W