前端项目获取geoserver图层列表

前言

前端项目获取GeoServer图层列表有两种方式：
一、REST请求方式
  REST方式可以先获取图层的组织情况，然后再获取各个图层的描述信息。但是该方法有一个缺点，需要首先登录获取权限，然后才允许发送rest请求，如果不在代码里模拟登陆就直接发送请求，会报403错误。
二、通过WFS请求获取
  在WFS请求中有一个方法DescribeFeatureType，具体方法描述可参考：DescribeFeatureType方法描述。该方法返回的数据为xml格式，需要解析。

  本文主要描述WFS方式获取图层列表。

一、发送WFS请求

  发送请求主要采用了通用的axios方式。代码如下（示例）：

import request from '@/plugin/axios'

export function getGeoSerevrLayers () {
  return request.get('/geoserver/ows?service=wfs&version=1.0.0&request=DescribeFeatureType')
}

  注意在自己的项目中输入完整的访问地址。

二、解析XML文件

  获取的xml内容都是经过编码的，需要用decodeURIComponent()函数来解码。xml结构如图所示
  每一个xsd:import标签内都有一个工作区的记录，其中namespace属性是工作区名称，schemaLocation中包含了该工作区下的所有图层信息。

  获取某一个工作区下的所有图层列表代码如下（示例）：

getGeoSerevrLayers().then(res => {
  var xmlDoc = xml.loadXML(res);
  //获取所有工作区
  //var all = xmlDoc.getElementsByTagName("xsd:import")
  //all.foreach(t=>{
  //   var schemaLocation = t.getAttribute("schemaLocation");
  //})
  //根据工作区名称获取
  var schemaLocation = xmlDoc.querySelector('[namespace="工作区名称"]').getAttribute("schemaLocation");
  var schemaLocationStr = decodeURIComponent(schemaLocation );
  var index = schemaLocationStr.indexOf("typeName=");
  var layerNameStr = schemaLocationStr.substring(index).substring(9);
  //图层名称列表
  var layerNameArray = layerNameStr.split(',');
}).catch((err) => console.log(err))}