<div dir="ltr"><div>Hello,<br></div><div><br></div><div>A least, you seem to got issues from 2 parts:</div><br>First,<br><br>```<br>const featureRequest = new ol.format.WFS().writeGetFeature({<br> srsName: 'EPSG:3857',<br> featureNS: '<a href="http://openstreemap.org">http://openstreemap.org</a>',<br> featurePrefix: 'osm',<br> featureTypes: ['emprise_3857'],<br> outputFormat: 'application/json',<br> filter: new ol.format.filter.equalTo('numoa', '25366'),<br>})<br>```<br><br>You want to use namespace whereas I'm not sure Mapserver use the same namespace or use any at all. The original server in the OpenLayers sample alias `<a href="http://openstreemap.org">http://openstreemap.org</a>` to `osm` as you can see at <a href="https://ahocevar.com/geoserver/wfs?request=GetCapabilities&service=WFS&version=2.0.0">https://ahocevar.com/geoserver/wfs?request=GetCapabilities&service=WFS&version=2.0.0</a><br><br><br>2nd issue: as you guessed, maybe, your Mapserver may not return JSON. You send it a POST with XML e.g `new XMLSerializer().serializeToString(featureRequest)` where your `featureRequest` contains `outputFormat: 'application/json'`. You may try using `outputFormat: 'application/gml+xml; version=3.2'`. I suppose your Mapserver support WFS 2.0 otherwise you may need `text/xml; subtype=gml/2.1.2` or `text/xml; subtype=gml/3.1.1`<br><br>In all case, before you try the part<br><br>```<br>.then(function (json) {<br> ...<br> ...<br>})<br>```<br><br>To troubleshot, you may change you code to <br><br>```<br>fetch(`<a href="http://blabla/cgi-bin/mapserv.exe?MAP=c:/.../naasp_ol.map`">http://blabla/cgi-bin/mapserv.exe?MAP=c:/.../naasp_ol.map`</a>, {<br> method: 'POST',<br> body: new XMLSerializer().serializeToString(featureRequest),<br>})<br>.then(function (resp) {<br> return resp.text();<br>})<br>.then(function (text) {<br> // See potential errors message<br> console.log(text)<br>})<br>```<br><br>To troubleshot, most of the time, I go "outside" of my OpenLayers code. OpenLayers generates magically a payload to send to a Mapserver endpoint. In fact, except, the syntax is in JS, the first issue is about sending the "right" content to this endpoint.<br><br>If you go to <a href="https://openlayers.org/en/latest/examples/vector-wfs-getfeature.html">https://openlayers.org/en/latest/examples/vector-wfs-getfeature.html</a>, open your browser Developper Tools, use the Network panel, filter to get the post http call and use the "Copy as curl" <a href="https://everything.curl.dev/usingcurl/copyas">https://everything.curl.dev/usingcurl/copyas</a>, you will see the exact POST content send to Mapserver endpoint<br><br><div>With this, you can simply debug by changing the content and run CURL in the command line. Not sure it's more easy than JS but at least you will avoid the JS language barrier to make your http calls to Mapserver endpoint.</div><div><br></div><div>Regards,</div><div><br></div><div>Thomas Gratier<br></div><br></div><br><div class="gmail_quote"><div dir="ltr" class="gmail_attr">Le mer. 26 oct. 2022 à 12:30, mathias cunault <<a href="mailto:mathias.cunault@inrap.fr">mathias.cunault@inrap.fr</a>> a écrit :<br></div><blockquote class="gmail_quote" style="margin:0px 0px 0px 0.8ex;border-left:1px solid rgb(204,204,204);padding-left:1ex"><div dir="ltr"><div class="gmail_default" style="font-family:verdana,sans-serif;font-size:large">Mapserver 7.6.0 & OL6<br></div><div class="gmail_default" style="font-family:verdana,sans-serif;font-size:large"><br></div><div class="gmail_default" style="font-family:verdana,sans-serif;font-size:large">My goal is to find a feature in a WFS layer and zoom on it using openLayers.</div><div><span class="gmail_default" style="font-family:verdana,sans-serif;font-size:large">Following this example </span><span class="gmail_default" style="font-family:verdana,sans-serif;font-size:large"><a href="https://openlayers.org/en/latest/examples/vector-wfs-getfeature.html" target="_blank">https://openlayers.org/en/latest/examples/vector-wfs-getfeature.html</a>, I am trying to do the same with Mapserver.</span></div><div><span class="gmail_default" style="font-family:verdana,sans-serif;font-size:large">I am not very familiar with Javascript so I feel uncomfortable in this exercise.<br></span></div><div><span class="gmail_default" style="font-family:verdana,sans-serif;font-size:large">I wrote :</span></div><div><span class="gmail_default" style="font-family:verdana,sans-serif;font-size:large">
</span><div style="color:rgb(212,212,212);background-color:rgb(30,30,30);font-family:Consolas,"Courier New",monospace;font-weight:normal;font-size:14px;line-height:19px;white-space:pre-wrap"><div><span style="color:rgb(86,156,214)">const</span><span style="color:rgb(212,212,212)"> </span><span style="color:rgb(79,193,255)">featureRequest</span><span style="color:rgb(212,212,212)"> = </span><span style="color:rgb(86,156,214)">new</span><span style="color:rgb(212,212,212)"> </span><span style="color:rgb(156,220,254)">ol</span><span style="color:rgb(212,212,212)">.</span><span style="color:rgb(156,220,254)">format</span><span style="color:rgb(212,212,212)">.</span><span style="color:rgb(220,220,170)">WFS</span><span style="color:rgb(212,212,212)">().</span><span style="color:rgb(220,220,170)">writeGetFeature</span><span style="color:rgb(212,212,212)">({</span></div><div><span style="color:rgb(212,212,212)"> </span><span style="color:rgb(156,220,254)">srsName</span><span style="color:rgb(156,220,254)">:</span><span style="color:rgb(212,212,212)"> </span><span style="color:rgb(206,145,120)">'EPSG:3857'</span><span style="color:rgb(212,212,212)">,</span></div><div><span style="color:rgb(212,212,212)"> </span><span style="color:rgb(156,220,254)">featureNS</span><span style="color:rgb(156,220,254)">:</span><span style="color:rgb(212,212,212)"> </span><span style="color:rgb(206,145,120)">'<a href="http://openstreemap.org" target="_blank">http://openstreemap.org</a>'</span><span style="color:rgb(212,212,212)">,</span></div><div><span style="color:rgb(212,212,212)"> </span><span style="color:rgb(156,220,254)">featurePrefix</span><span style="color:rgb(156,220,254)">:</span><span style="color:rgb(212,212,212)"> </span><span style="color:rgb(206,145,120)">'osm'</span><span style="color:rgb(212,212,212)">,</span></div><div><span style="color:rgb(212,212,212)"> </span><span style="color:rgb(156,220,254)">featureTypes</span><span style="color:rgb(156,220,254)">:</span><span style="color:rgb(212,212,212)"> [</span><span style="color:rgb(206,145,120)">'emprise_3857'</span><span style="color:rgb(212,212,212)">],</span></div><div><span style="color:rgb(212,212,212)"> </span><span style="color:rgb(156,220,254)">outputFormat</span><span style="color:rgb(156,220,254)">:</span><span style="color:rgb(212,212,212)"> </span><span style="color:rgb(206,145,120)">'application/json'</span><span style="color:rgb(212,212,212)">,</span></div><div><span style="color:rgb(212,212,212)"> </span><span style="color:rgb(156,220,254)">filter</span><span style="color:rgb(156,220,254)">:</span><span style="color:rgb(212,212,212)"> </span><span style="color:rgb(86,156,214)">new</span><span style="color:rgb(212,212,212)"> </span><span style="color:rgb(156,220,254)">ol</span><span style="color:rgb(212,212,212)">.</span><span style="color:rgb(156,220,254)">format</span><span style="color:rgb(212,212,212)">.</span><span style="color:rgb(156,220,254)">filter</span><span style="color:rgb(212,212,212)">.</span><span style="color:rgb(220,220,170)">equalTo</span><span style="color:rgb(212,212,212)">(</span><span style="color:rgb(206,145,120)">'numoa'</span><span style="color:rgb(212,212,212)">, </span><span style="color:rgb(206,145,120)">'25366'</span><span style="color:rgb(212,212,212)">),</span></div><div><span style="color:rgb(212,212,212)">})</span></div><br><div><span style="color:rgb(156,220,254)">console</span><span style="color:rgb(212,212,212)">.</span><span style="color:rgb(220,220,170)">log</span><span style="color:rgb(212,212,212)">(</span><span style="color:rgb(79,193,255)">featureRequest</span><span style="color:rgb(212,212,212)">)</span></div><br><div><span style="color:rgb(220,220,170)">fetch</span><span style="color:rgb(212,212,212)">(</span><span style="color:rgb(206,145,120)">`http://<span class="gmail_default" style="font-family:verdana,sans-serif;font-size:large">blabla</span>/cgi-bin/mapserv.exe?MAP=c:/<span class="gmail_default" style="font-family:verdana,sans-serif;font-size:large">...</span>/naasp_ol.map`</span><span style="color:rgb(212,212,212)">, {</span></div><div><span style="color:rgb(212,212,212)"> </span><span style="color:rgb(156,220,254)">method</span><span style="color:rgb(156,220,254)">:</span><span style="color:rgb(212,212,212)"> </span><span style="color:rgb(206,145,120)">'POST'</span><span style="color:rgb(212,212,212)">,</span></div><div><span style="color:rgb(212,212,212)"> </span><span style="color:rgb(156,220,254)">body</span><span style="color:rgb(156,220,254)">:</span><span style="color:rgb(212,212,212)"> </span><span style="color:rgb(86,156,214)">new</span><span style="color:rgb(212,212,212)"> </span><span style="color:rgb(78,201,176)">XMLSerializer</span><span style="color:rgb(212,212,212)">().</span><span style="color:rgb(220,220,170)">serializeToString</span><span style="color:rgb(212,212,212)">(</span><span style="color:rgb(79,193,255)">featureRequest</span><span style="color:rgb(212,212,212)">),</span></div><div><span style="color:rgb(212,212,212)">})</span></div><div><span style="color:rgb(212,212,212)">.</span><span style="color:rgb(220,220,170)">then</span><span style="color:rgb(212,212,212)">(</span><span style="color:rgb(86,156,214)">function</span><span style="color:rgb(212,212,212)"> (</span><span style="color:rgb(156,220,254)">rep</span><span style="color:rgb(212,212,212)">) {</span></div><div><span style="color:rgb(212,212,212)"> </span><span style="color:rgb(197,134,192)">return</span><span style="color:rgb(212,212,212)"> </span><span style="color:rgb(156,220,254)">rep</span><span style="color:rgb(212,212,212)">.</span><span style="color:rgb(220,220,170)">json</span><span style="color:rgb(212,212,212)">();</span></div><div><span style="color:rgb(212,212,212)">})</span></div><div><span style="color:rgb(212,212,212)">.</span><span style="color:rgb(220,220,170)">then</span><span style="color:rgb(212,212,212)">(</span><span style="color:rgb(86,156,214)">function</span><span style="color:rgb(212,212,212)"> (</span><span style="color:rgb(156,220,254)">json</span><span style="color:rgb(212,212,212)">) {</span></div><div><span style="color:rgb(212,212,212)"> </span><span style="color:rgb(86,156,214)">const</span><span style="color:rgb(212,212,212)"> </span><span style="color:rgb(79,193,255)">features</span><span style="color:rgb(212,212,212)"> = </span><span style="color:rgb(86,156,214)">new</span><span style="color:rgb(212,212,212)"> </span><span style="color:rgb(156,220,254)">ol</span><span style="color:rgb(212,212,212)">.</span><span style="color:rgb(156,220,254)">format</span><span style="color:rgb(212,212,212)">.</span><span style="color:rgb(220,220,170)">GeoJSON</span><span style="color:rgb(212,212,212)">().</span><span style="color:rgb(220,220,170)">readFeatures</span><span style="color:rgb(212,212,212)">(</span><span style="color:rgb(156,220,254)">json</span><span style="color:rgb(212,212,212)">)</span></div><div><span style="color:rgb(212,212,212)"> </span><span style="color:rgb(86,156,214)">new</span><span style="color:rgb(212,212,212)"> </span><span style="color:rgb(156,220,254)">ol</span><span style="color:rgb(212,212,212)">.</span><span style="color:rgb(156,220,254)">source</span><span style="color:rgb(212,212,212)">.</span><span style="color:rgb(156,220,254)">Vector</span><span style="color:rgb(212,212,212)">.</span><span style="color:rgb(220,220,170)">addFeatures</span><span style="color:rgb(212,212,212)">(</span><span style="color:rgb(79,193,255)">features</span><span style="color:rgb(212,212,212)">)</span></div><div><span style="color:rgb(212,212,212)"> </span><span style="color:rgb(156,220,254)">map</span><span style="color:rgb(212,212,212)">.</span><span style="color:rgb(220,220,170)">getView</span><span style="color:rgb(212,212,212)">().</span><span style="color:rgb(220,220,170)">fit</span><span style="color:rgb(212,212,212)">(</span><span style="color:rgb(86,156,214)">new</span><span style="color:rgb(212,212,212)"> </span><span style="color:rgb(156,220,254)">ol</span><span style="color:rgb(212,212,212)">.</span><span style="color:rgb(156,220,254)">source</span><span style="color:rgb(212,212,212)">.</span><span style="color:rgb(156,220,254)">Vector</span><span style="color:rgb(212,212,212)">.</span><span style="color:rgb(220,220,170)">getExent</span><span style="color:rgb(212,212,212)">())</span></div><div><span style="color:rgb(212,212,212)">})</span></div></div>
<span class="gmail_default" style="font-family:verdana,sans-serif;font-size:large"></span></div><div><span class="gmail_default" style="font-family:verdana,sans-serif;font-size:large"></span></div><div><div dir="ltr"><div dir="ltr"><div><div dir="ltr"><div><div dir="ltr"><div><div dir="ltr"><div><div dir="ltr"><div><div><div style="font-family:verdana,sans-serif;font-size:large" class="gmail_default">But the chrome console says that there is an issue with the promise that it is not a valid JSON.<br></div><div style="font-family:verdana,sans-serif;font-size:large" class="gmail_default">Is it coming from the fetch I wrote in a bad way or a problem with application/json ?<br></div><div style="font-family:verdana,sans-serif;font-size:large" class="gmail_default">Indeed I read in Mapserver doc that only mapserver 8+ could handle application/json (from what I understood)<br></div></div><div><br></div><div><div style="font-family:verdana,sans-serif;font-size:large" class="gmail_default">Maybe it is both? I feel a bit lost.<br></div><div style="font-family:verdana,sans-serif;font-size:large" class="gmail_default">I tried to find more examples and doc on the net, but nothing clear for me. Maybe you can help?<br></div><div style="font-family:verdana,sans-serif;font-size:large" class="gmail_default">Thanks</div><br></div><div><br><div><i style="font-size:small">----------</i></div><div><font size="1"><i>Mathias Cunault</i><br></font></div></div></div><div><font size="1"><i>référent SIG / Admin Caviar<br></i><i><i>Inrap Tours - </i>148 av. Maginot<br>37000 TOURS<br>06 32 05 98 96</i></font><font size="1"><br></font></div><div><font size="1">abonn</font><i style="font-size:small"></i><font size="1">ez-vous à la lettre d'information de l'Inrap : <a href="http://www.inrap.fr/newsletter.php" target="_blank">http://ww</a></font><font size="1"><a href="http://www.inrap.fr/newsletter.php" target="_blank">w.inrap.fr/newsletter.php</a></font><br></div></div></div></div></div></div></div></div></div></div></div></div></div>
_______________________________________________<br>
MapServer-users mailing list<br>
<a href="mailto:MapServer-users@lists.osgeo.org" target="_blank">MapServer-users@lists.osgeo.org</a><br>
<a href="https://lists.osgeo.org/mailman/listinfo/mapserver-users" rel="noreferrer" target="_blank">https://lists.osgeo.org/mailman/listinfo/mapserver-users</a><br>
</blockquote></div>