2

I have the following map which works perfectly:

import 'ol/ol.css';
import {Map, View} from 'ol';
import TileLayer from 'ol/layer/Tile';
import TileWMS from 'ol/source/TileWMS';
import BingMaps from 'ol/source/BingMaps'
import VectorLayer from 'ol/layer/Vector';
import VectorSource from 'ol/source/Vector';
import GeoJSON from 'ol/format/GeoJSON';

var baseLayer = new TileLayer({
source: new BingMaps({
   key: 'mykey',
   imagerySet:'AerialWithLabels'}),
});

var map = new Map({
  layers: [baseLayer],
  target: 'map',
  view: new View({
    zoom: 11,
  }),
});

When I add a WMS layer to this map it displays correctly:

var layer = new TileLayer({
  source: new TileWMS({
    url: 'http://myip:8080/geoserver/MYWORKSPACE/wms',
    params: {'LAYERS': 'MYWORKSPACE:MYLAYER', 'TILED': true},
    serverType: 'geoserver',
  }),
});

map.addLayer(layer)

But when I add the same layer but as WFS:

var layer2 = new VectorLayer({
  source: new VectorSource({
    format: new GeoJSON(),
    url: function(extent) {
      return  'http://myip:8080/geoserver/MYWORKSPACE/wfs?' +
              'service=WFS&' +
              'version=1.0.0&request=GetFeature&typename=MYLAYER&'+
              'outputFormat=application/json';
    }
  })
});

map.addLayer(layer2)

It shows nothing and gives me the following error:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://myip:8080/geoserver/MYWORKSPACE/wfs?service=W…GetFeature&typename=MYLAYER&outputFormat=application/json. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).

I know I could enable CORS on my server and maybe it would work but I don't understand why displaying the layer as WMS doesn't give me this CORS error.

I wouldn't like to enable CORS on my server because I already tried that last day without success, so If there was a way to show this layer as a WFS without touching the server would be perfect.

2

WMS is requesting an image so there is no CORS issue. When you request a WFS feature collection the browser is more worried and needs you to handle CORS correctly.

  • Well then I will have to configure my server, thanks – David1212k Oct 31 '19 at 19:37

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.