[JavaScript知识库] OpenLayers ArcGISRest Service 带参数请求URL长度过长问题

开发: C++知识库 Java知识库 JavaScript Python PHP知识库人工智能区块链大数据移动开发嵌入式开发工具数据结构与算法开发测试游戏开发网络协议系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑笔记本显卡显示器固态硬盘硬盘耳机手机 iphone vivo oppo 小米华为单反装机图拉丁

-> JavaScript知识库 -> OpenLayers ArcGISRest Service 带参数请求URL长度过长问题 -> 正文阅读

[JavaScript知识库]OpenLayers ArcGISRest Service 带参数请求URL长度过长问题

`TileArcGISRest` 和 `ImageArcGISRest` 比较

TileArcGISRest 是以地图瓦片的方式加载显示地图，地图一片一片加载显示。
ImageArcGISRest 是将当前地图视窗范围里的一次性加载显示。

注意：图层服务矢量数据较多的情况，TileArcGISRest 加载显示效果较好。但是，如果矢量图形是带 label 的渲染样式，同时矢量图形跨了多个瓦片范围，服务返回的瓦片图片上均带有 label。而矢量图形又多，ImageArcGISRest 整个加载耗时较长，看情况选择方案。

图斑动态过滤

不论是 TileArcGISRest 还是 ImageArcGISRest，都提供了一个 params 参数，参数值同 ArcGIS REST APIs - export 用来过滤要渲染的矢量数据。

请添加图片描述
查看请求可知都是以 get 请求的 ArcGIS REST APIs，这就存在了一个问题，参数过多导致 url 过长的问题。¹

URL 过长解决方案

参数过长的时候，我们可以提供 imageLoadFunction 或 tileLoadFunction 参数，用我们指定的方法去加载图片数据。

function loadFunction(image,src) {
  var xhr = new XMLHttpRequest();
  xhr.responseType = "blob";
  xhr.addEventListener("loadend", function() {
    var data = this.response;
    if (data) {
      var img = image.getImage();
      var url = URL.createObjectURL(data);
      img.addEventListener("loadend", function() {
        URL.revokeObjectURL(url);
      });
      img.src = url;
    }
  });
  var split = src.split("?");
  xhr.open("POST", split[0]);
  xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  xhr.send(split[1]);
}

new TileLayer({
  source: new TileArcGISRest({
    url: 'url',
    params: {},
    tileLoadFunction: loadFunction
  })
})

new ImageLayer({
  source: new ImageArcGISRest({
    url: 'url',
    params: {},
    imageLoadFunction: loadFunction
  })
})