Bonjour,
Côté serveur carto :
J'ai installé sur mon poste GeoServer 2.9.1.
Lié à une base PostgreSQL/PostGIS, j'ai crée une couche de ponctuels qui s'affiche correctement à la prévisualisation, sur une adresse du genre : http://localhost:8080/geoserver/cite...s=cite:bureaux
Coté interface web :
Je tourne sur WampServer 2.2. J'ai crée une page faisant appel à OpenLayers 3 pour afficher les données issues de GeoServer. Elle est sur une URL du genre : http://localhost/OLv3.18.2/index.php.
Si les fonds raster tuilés OSM s'affichent sans problème, il n'en est pas de même de l'affichage de ma couche de ponctuels, chargée au format GeoJSON.
Firefox m'indique : Blocage d’une requête multi-origines (Cross-Origin Request) : la politique « Same Origin » ne permet pas de consulter la ressource distante située sur http://localhost:8080/geoserver/cite...plication/json. Raison : l’en-tête CORS « Access-Control-Allow-Origin » est manquant.
Chrome m'indique : XMLHttpRequest cannot load http://localhost:8080/geoserver/cite...plication/json. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost' is therefore not allowed access.
Voici mon script :
Comment régler ce problème de Cross-Origin, sachant qu'on trouve de tout tel que modification du fichier web.xml de geoserver, etc..., mais appliqué sans succès pour moi ?
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31 var vectorSource = new ol.source.Vector({ format: new ol.format.GeoJSON(), url: function(extent) { return 'http://localhost:8080/geoserver/cite/ows?service=WFS&' + 'version=1.0.0&request=GetFeature&typeName=cite:bureaux&' + 'maxFeatures=50&outputFormat=application/json'; } }); var vector = new ol.layer.Vector({ source: vectorSource, style: new ol.style.Style({ stroke: new ol.style.Stroke({ color: 'rgba(0, 0, 255, 1.0)', width: 2 }) }) }); var raster = new ol.layer.Tile({ source: new ol.source.OSM() }); var map = new ol.Map({ target: 'map', layers: [ vector ], view: new ol.View({ center: ol.proj.fromLonLat([2.1307973,48.8289161]), zoom: 14 }) });
Merci d'avance.
Partager