将 XML 响应转换为有用的数据

Question

我正在通过发送请求以获取一些数据来与服务器 (Geoserver) 进行交互。

数据是关于某些特征的地理信息。

这是我的做法：

function filter() {
    var demande = new XMLHttpRequest();
    var url ='http://localhost:8080/geoserver/wfs?request=GetFeature&version=1.1.0&typeName=topp:refer_22&propertyName=Name,maticha&outputFormat=GML2&FILTER=%3CFilter%20xmlns=%22http://www.opengis.net/ogc%22%3E%3CPropertyIsBetween%3E%3CPropertyName%3Etopp:maticha%3C/PropertyName%3E%3CLowerBoundary%3E%3CLiteral%3E4500%3C/Literal%3E%3C/LowerBoundary%3E%3CUpperBoundary%3E%3CLiteral%3E5000%3C/Literal%3E%3C/UpperBoundary%3E%3C/PropertyIsBetween%3E%3C/Filter%3E'
    demande.open("GET", url);
    demande.onload=() => {
         console.log(demande.response);
    }
    demande.send();
}

请求是获取符合条件的数据（ x

一切正常，只是我在控制台中得到的结果很长：

<wfs:FeatureCollection
    xmlns="http://www.opengis.net/wfs"
    xmlns:wfs="http://www.opengis.net/wfs"
    xmlns:gml="http://www.opengis.net/gml"
    xmlns:topp="http://www.openplans.org/topp"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.opengis.net/wfs http://localhost:8080/geoserver/schemas/wfs/1.0.0/WFS-basic.xsd http://www.openplans.org/topp http://localhost:8080/geoserver/wfs?service=WFS&amp;version=1.0.0&amp;request=DescribeFeatureType&amp;typeName=topp%3Arefer_22,topp%3Arefer_22">
    <gml:boundedBy>
        <gml:null>unknown</gml:null>
    </gml:boundedBy>
    <gml:featureMember>
        <topp:refer_22 fid="refer_22.9">
            <topp:the_geom>
                <gml:MultiPolygon srsName="http://www.opengis.net/gml/srs/epsg.xml#4326">
                    <gml:polygonMember>
                        <gml:Polygon>
                            <gml:outerBoundaryIs>
                                <gml:LinearRing>
                                    <gml:coordinates
                                        xmlns:gml="http://www.opengis.net/gml" decimal="." cs="," ts=" ">34.69647,-1.919276 34.69651,-1.918997 34.697229,-1.919003 34.697317,-1.918058 34.697418,-1.91713 34.697462,-1.91653 34.697568,-1.915618 34.697837,-1.914641 34.698261,-1.913174 34.698614,-1.912023 34.699005,-1.910633 34.697456,-1.909919 34.696871,-1.909666 34.695711,-1.90917 34.694404,-1.908606 34.693794,-1.908351 34.69322,-1.908068 34.69202,-1.907558 34.691892,-1.908461 34.691702,-1.909658 34.69146,-1.910865 34.691429,-1.911192 34.691252,-1.912179 34.691063,-1.913338 34.690979,-1.913724 34.690851,-1.914132 34.690772,-1.914518 34.690644,-1.915205 34.690489,-1.915998 34.690145,-1.91764 34.690017,-1.918244 34.689918,-1.918702 34.689845,-1.919067 34.6897,-1.919978 34.689386,-1.92124 34.689422,-1.923584 34.69097,-1.923686 34.692518,-1.923552 34.6928,-1.923519 34.69329,-1.923428 34.693444,-1.923401 34.694662,-1.923037 34.695372,-1.922404 34.695663,-1.922034 34.695943,-1.921564 34.696161,-1.921111 34.696298,-1.920569 34.696399,-1.920022 34.696444,-1.91966 34.69647,-1.919276
                                    </gml:coordinates>
                                </gml:LinearRing>
                            </gml:outerBoundaryIs>
                        </gml:Polygon>
                    </gml:polygonMember>
                </gml:MultiPolygon>
            </topp:the_geom>
            <topp:Name>OUJ-DK9</topp:Name>
            <topp:maticha>4500</topp:maticha>
        </topp:refer_22>
    </gml:featureMember>
</wfs:FeatureCollection>

如您所见，以上是字符串格式的结果。有一个“Geometry”字段（the_geom）、一个“name”字段和一个名为“maticha”的字段（用于过滤数据）。

这很好，但我宁愿获得数据的 SON 格式或某种可以访问它的数组。

例如，我希望能够写：

var geometry = response[..]  

获取返回结果的坐标列表。

有什么办法吗？？

Answer 1

Geoserver 通过outputFormat parameter 支持不同的结果格式。您的请求将其设置为 GML2，即 XML。还支持 JSON 输出。

由于您的请求 URL 真的很难阅读和操作，我建议您使用 UrlSearchParams object 而不是尝试在一大堆凌乱的行中手动管理 URL 参数。

这是我将如何实现您的 filter() 函数的方法。

function filter(lowerBoundary, upperBoundary, onSuccess) {
    var params = new URLSearchParams();
    params.append('request', 'GetFeature');
    params.append('version', '1.1.0');
    params.append('typeName', 'topp:refer_22');
    params.append('propertyName', 'Name,maticha');
    params.append('outputFormat', 'application/json');
    params.append('filter', `<Filter xmlns="http://www.opengis.net/ogc">
      <PropertyIsBetween>
        <PropertyName>topp:maticha</PropertyName>
        <LowerBoundary><Literal>${lowerBoundary}</Literal></LowerBoundary>
        <UpperBoundary><Literal>${upperBoundary}</Literal></UpperBoundary>
      </PropertyIsBetween>
    </Filter>`);
    var demande = new XmlHttpRequest();
    demande.open("GET", 'http://localhost:8080/geoserver/wfs?' + params.toString());
    demande.onload = () => onSuccess(JSON.parse(demande.response));
    demande.send();
}

// later ...
filter(4000, 5000, (data) => {
    console.log(data):
});

似乎还有更简单的过滤器语法可用，请参阅ECQL。