请求WFS时的小技巧

本文介绍了在请求WFS服务时遇到的问题,包括返回的JSON数据导致查询功能无法实现。通过深入研究Geoserver,找到了正确的GML和GeoJSON数据路径。通过构建XML Filter并使用Ajax获取GeoJSON信息,最终成功实现了查询功能,特别是在处理中文和特殊符号的编码问题上提出了解决方案。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

请求WFS主要是为了实现查询功能,为了实现查询功能我做了多次尝试

官网的https://openlayers.org/en/latest/examples/vector-wfs-getfeature.html
但是最后返回的json有问题,导致查询功能不能实现,分析为请求wfs的路径有问题
即featureNS: 'http://host:8081/geoserver/DCampus/wfs',
        featurePrefix: 'WFS',这两处

多种尝试无果后决定在研究geoserver,得到gml路径http://host:8081/geoserver/DCampus/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=DCampus:cambuild&maxFeatures=50
将其转化为请求geojson数据http://host:8081/geoserver/DCampus/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=DCampus:cambuild&outputFormat=application/json&srsName=epsg:3857
通过研究自己构建Filter的xml编码,终于实现了查询功能(QQ浏览器),写在了index.html中,这个也需要将服务器配置为允许跨源访问才能在chrome上用。

以下代码是用ajax获取geojson然后实现查询功能

$.ajax({
            // type:'POST',
       url:'http://host:8081/geoserver/DCampus/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=DCampus:cambuild&FILTER=%3CFilter%3E%3CPropertyIsEqualTo%3E%3CPropertyName%3Ebname%3C/PropertyName%3E%20%3CLiteral%3E%E8%A5%BF%E7%A4%BC%E5%A0%82%3C/Literal%3E%3C/PropertyIsEqualTo%3E%3C/Filter%3E&outputFormat=application/json&srsName=epsg:3857',
       dataType:'json',
       success:function(data){var features = new ol.format.GeoJSON().readFeatures(data);
        vectorSource.addFeatures(features);
        map.getView().fit(vectorSource.getExtent());},
        })

用http://localhost:8081/geoserver/DCampus/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=DCampus:cambuild&FILTER=<Filter><PropertyIsEqualTo><PropertyName>bname</PropertyName>  <Literal>西礼堂</Literal></PropertyIsEqualTo></Filter>&outputFormat=application/json&srsName=epsg:3857可以获取西礼堂图块的geojson信息

注意写在代码中时,中文与一些特殊符号都必须转换格式,实测js用encodeURI(url);

ajax请求时url格式需要特别注意,除了encodeURI(),还有escape()和encodeURIComponent()有类似功能

 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值