First time trying to draw an Openlayers map with GeoJSON instead of WMS, and not having much luck. My layer is hosted in Geoserver and is named 'sections', in a workspace called 'basic_map'. This is my code so far:

var vectorLayer = new ol.layer.Vector({
    source: new ol.source.Vector({
    url: 'http://localhost:8082/geoserver/basic_map/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=basic_map:sections&maxFeatures=50&outputFormat=application%2Fjson',
    format: new ol.format.GeoJSON(),
    crossOrigin: 'anonymous',

 var mapcentre= ol.proj.transform([157.83430,-33.07209],
'EPSG:4326', 'EPSG:3857');

  var map = new ol.Map({
    layers: [

    target: 'map',
    view: new ol.View({
      center: mapcentre,
      zoom: 14

The URL link is just copied from the layer preview, which I'm not sure on as some examples use wfs instead.

The developer console also shows an error saying 'Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://localhost:8082/geoserver/basic_map/ows?.........'

2 Answers 2


Thanks to Alex Leith below for putting me on the right track...the fix was slightly different so I'll give the details:

  1. Entered this script into web.xml, found in C:\Program Files (x86)\GeoServer 2.10.1\webapps\geoserver\WEB-INF (sorry the HTML tags are not displaying):

    cross-origin org.eclipse.jetty.servlets.CrossOriginFilter
    cross-origin /*

  2. Download and copy jetty-servlets-9.2.13.v20150730.jar into C:\Program Files (x86)\GeoServer 2.10.1\webapps\geoserver\WEB-INF\lib, NOT the path mentioned in the OpenGeo Suite docs. Also I was a bit confused as I already had a .jar file called 'jetty-servlet-', without the 's'. Which is not the same thing.

  3. For good measure, I removed the comment markers from this code in the web.xml file, and set it as 'true', eg.


  4. For the URL in the openlayers ol.source.Vector/ ol.format.GeoJSON, I just copied the URL from the layer preview. Eg.

    var vectorLayer = new ol.layer.Vector({ source: new ol.source.Vector({ format: new ol.format.GeoJSON(), crossOrigin: 'anonymous', url: http://localhost:8082/geoserver/basic_map/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=basic_map:sections&maxFeatures=50&outputFormat=application%2Fjson',


Check this out: http://suite.opengeo.org/docs/latest/sysadmin/cors/index.html

You need to either enable JSONP for GeoServer, or set up cross origin resource sharing.

It's about the same complexity to do both, so I suggest setting up CORS.

  • 1
    Cheers. There is a jetty-servlet.jar file already included by default in the Geoserver/lib folder, that link you have references a jetty-servletS.jar file to be put into C:\Program Files (x86)\Boundless\OpenGeo\jetty\lib. Is there any difference? I also don't have Opengeo suite.
    – Bill
    Apr 19, 2017 at 6:11
  • Hey @Bill, the opengeosuite doco should be similar for GeoServer. Just follow step one in the URL above.
    – Alex Leith
    Apr 19, 2017 at 23:36
  • I'm finding that by adding that <filter> and <filter-mapping> text into my web.xml file, Geoserver won't start after being shutdown, and will start only if I remove the text. I've also changed (in the same web.xml file) ENABLE_JSONP to be true. Any more ideas? Its definitely not an out-of-the-box program!
    – Bill
    Apr 20, 2017 at 0:32
  • Are you running TOMCAT or JETTY? I know it can be fiddly to do these things... but when it's working it will just keep working!
    – Alex Leith
    Apr 20, 2017 at 2:05
  • Its JETTY, and the Geoserver version is 2.11.0. Cheers
    – Bill
    Apr 20, 2017 at 3:11

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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