2

I want to connect wfs in json format from geoserver to openlayer in j2EE platform for web application i have this server :http://localhost:8085/ for geoserver :http://localhost:8080/

with this code:

// a tiled raster layer as the backdrop
var tiledRaster = new ol.layer.Tile({
  source: new ol.source.OSM()
});


//faire une transformation des coordonnées du WGP en SPHERICAL MERCATOR
var center = ol.proj.transform([-5.833379, 35.7632691], 'EPSG:4326', 'EPSG:3857');
var view = new ol.View({
  center: center,
  zoom: 13,
  minZoom: 5,
  maxZoom: 18
});




//Affichage de l'echelle
var scaleLineControl = new ol.control.ScaleLine();
scaleLineControl.setUnits('metric');
var vectorSource = new ol.source.Vector({
  loader: function() {

    // use jsonp: false to prevent jQuery from adding the "callback"
    // parameter to the URL
    $.ajax('http://localhost:8080/geoserver/mymap/ows', {
      type: 'GET',
      data: {
        service: 'WFS',
        version: '1.0.0',
        request: 'GetFeature',
        typename: 'mymap:mar_adm4',
        outputFormat: 'application/json',
        srsname: 'EPSG:4326',
        bbox: '-13.2287683486938,27.6288108825684,-0.936553478240967,35.9639053344727' + ',EPSG:4326'
      }

      /*,
   strategy: ol.loadingstrategy.tile(ol.tilegrid.createXYZ({
     maxZoom: 19
   }))*/
    });
  }
});


/**
 * JSONP WFS callback function.
 * @param {Object} response The response object.
 */
window.loadFeatures = function(response) {
  vectorSource.addFeatures(geojsonFormat.readFeatures(response));
};

var vector = new ol.layer.Vector({
  source: vectorSource,
  style: new ol.style.Style({
    stroke: new ol.style.Stroke({
      color: 'rgba(0, 255, 0, 1.0)',
      width: 2
    })
  })
});



//Creation de la map
var map = new ol.Map({
  target: 'map',
  controls: ol.control.defaults({
    attributionOptions: /** @type {olx.control.AttributionOptions} */ ({
      collapsible: false
    })
  }).extend([
    scaleLineControl
  ]),
  layers: [
    //tiledRaster ,
    vector
  ],
  view: view
});


zoomslider = new ol.control.ZoomSlider();
map.addControl(zoomslider);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="map" class="map" style="width:1400px;height:600px;background-color: orange ;align:left"></div>

I get this error:

XMLHttpRequest cannot load http://localhost:8080/geoserver/mymap/ows?service=WFS&version=1.0.0&request…8%2C27.6288108825684%2C-0.936553478240967%2C35.9639053344727%2CEPSG%3A4326. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8085' is therefore not allowed access.

0 Answers0