OpenLayers 3: demande d'origine croisée bloquée: la même politique d'origine interdit [dupliquer]

Avec OpenLayers 3, je n'arrive pas à faire disparaître ce message:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://myserver:8085/geoserver/sf/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=sf:view1&maxFeatures=1&outputFormat=JSON. This can be fixed by moving the resource to the same domain or enabling CORS.

Voici le code:

// Ol3 only supports Projections "EPSG:4326" and "EPSG:3857". For every other projection you need proj4js
        proj4.defs("EPSG:2236", "+proj=tmerc +lat_0=24.33333333333333 +lon_0=-81 +k=0.999941177 +x_0=200000.0001016002 +y_0=0 +ellps=GRS80 +towgs84=0,0,0,0,0,0,0 +units=us-ft +no_defs");

        // Leases Layer
        var myLayer = new ol.layer.Vector({
            source: new ol.source.GeoJSON({
                projection: 'EPSG:2236',
                url: 'http://myserver:8085/geoserver/sf/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=sf:view1&maxFeatures=1&outputFormat=JSON',
                crossOrigin: null
            })
        });

// View
        var view = new ol.View({
            projection: 'EPSG:2236',
            center: [0, 0],
            zoom: 4
        });

        // Map
        var map = new ol.Map({
            target: 'map',
            renderer: 'canvas',
            layers: [myLayer],
            view: view
        });

J'ai essayé de définir le paramètre crossOrigin sur:

crossOrigin: null
crossOrigin: 'null'
crossOrigin: 'anonymous'

Je ne vois que le contrôle du zoom avant / arrière mais le calque n'est pas rendu.

Je suis allé avec l'option 3 de simon ci-dessous. J'ai activé CORS dans GeoServer en copiant les fichiers jar nécessaires de jetty-servlets et en l'activant dans le \ WEB-INF \ web.xml:

<filter>
    <filter-name>cross-origin</filter-name>
    <filter-class>org.eclipse.jetty.servlets.CrossOriginFilter</filter-class>
    <init-param>
        <param-name>allowedOrigins</param-name>
        <param-value>*</param-value>
    </init-param>
    <init-param>
        <param-name>allowedMethods</param-name>
        <param-value>*</param-value>
    </init-param>
    <init-param>
        <param-name>allowedHeaders</param-name>
        <param-value>*</param-value>
    </init-param>
</filter>
<filter-mapping>
    <filter-name>cross-origin</filter-name>
    <filter-pattern>/*</filter-pattern>
</filter-mapping>

Après avoir fait cela, j'ai de nouveau testé la page et je reçois la même erreur:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://myserver:8085/geoserver/sf/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=sf:view1&maxFeatures=1&outputFormat=JSON. This can be fixed by moving the resource to the same domain or enabling CORS.

On dirait que je manque encore quelque chose. Dois-je faire quelque chose du côté OpenLayers?

J'ai fini par me débarrasser de Jetty et désinstaller complètement GeoServer. Le problème est que lorsque vous installez le programme d'installation de geoserver windows, il installe une version de jetty qui a 4 ans! (Jetty version 6.1.8) Même si j'avais copié les fichiers jar pour CORS, il n'est pris en charge que dans Jetty 7+.

J'ai découvert que vous pouvez installer un fichier WAR. J'ai décidé d'utiliser Tomcat car c'est ce sur quoi GeoServer est principalement testé selon cette note du site GeoServer:

Remarque GeoServer a été principalement testé à l'aide de Tomcat, et par conséquent ces instructions peuvent ne pas fonctionner avec d'autres applications de conteneur.

Voici les instructions pour installer le fichier WAR:

http://docs.geoserver.org/stable/en/user/installation/war.html

C'est aussi une belle vidéo de démonstration:

https://www.youtube.com/watch?v=YEOA8WWWVCw

Une fois l'installation terminée, vous activez CORS:

http://enable-cors.org/server_tomcat.html

Il existe une solution de contournement simple en utilisant JSONP à la place:

1. Vous devez activer JSONP dans le géoserveur. Pour activer JSONP, vous devez ajouter les éléments suivants dans votre web.xml (par exemple C: \ Program Files (x86) \ GeoServer 2.4.4 \ webapps \ geoserver \ WEB-INF \ web.xml)

... ENABLE_JSONP true ... 2. Redémarrez votre géoserveur. Maintenant, pour la demande GetFeatureInfo , le géoserveur enverra parseResponse (données JSON) au client

3. Comment fonctionne JSONP à partir du client (JavaScript)? L'appel JSONP est simple. Vous devez ajouter un script avec src = url (l' url est l' URL GetFeatureInfo) dans l'en-tête

   var tag = document.createElement ("script"); tag.src = url; document.getElementsByTagName ("head") [0] .appendChild (tag);

Une fois le script ajouté, il appellera jsonp depuis le serveur. appel de la fonction parseRespose. Vous devez donc définir une fonction parseResponse comme suit. La portée de cette fonction doit être globale.

function parseResponse (data) {var feature = data.features [0]; console.log (fonctionnalité);
};

J'ai moi-même fait face au même problème et j'ai essayé de nombreuses solutions qui ont été discutées ici ou dans d'autres forums et j'ai finalement réussi à résoudre le problème d'activation de Cross Origin dans Geoserver.

Après de nombreux essais, j'ai découvert que la solution est assez simple en suivant les étapes exactes trouvées dans la page Web Jetty Jetty Cross Origin Filter .

Mais avec un petit changement, la page a dit que nous devons copier le filtre Cross-Origin suivant dans le fichier de configuration ( Web.xml ), mais la solution qui a fonctionné avec moi est de copier cette configuration de filtre xml dans ( webdefault.xml ) fichier de configuration, lors de l'application de ce changement, le géoserveur fonctionnait comme un charme et je pouvais exécuter n'importe quel WFS, WMS GetFeatureInfoRequest au format JSON en utilisant AJAX au lieu d'utiliser IFrame soultion.

J'utilise les versions logicielles suivantes:

• Boundless OpenGeo v4.5.
• Geoserver v 2.6.2.
• Jetty v 7.6.13.v20130916.

Voici les étapes détaillées:

1. Téléchargez la version correspondante des servlets Jetty en fonction de votre version Jetty à partir de cette page Jetty Servlets .
2. Dans cet exemple, j'utilise jetty v7.6.13.v20130916 donc le fichier jar doit être nommé
   ( jetty-servlets-7.6.13.v20130916.jar ) le nom de fichier sera différent selon la version de la jetée - ne changez pas son nom car jetty correspond au nom du servlet avec sa version comme:
   jetty-servlets - <% JETTY_VERSION%>. jar, alors ne le renommez pas.

3. Arrêtez les services (GeoServer, Postgres) et prenez une copie du répertoire OpenGeo situé dans
   ( C: \ Program Files (x86) \ boundless \ OpenGeo ) et copiez également le répertoire OpenGeo situé dans
   ( C: \ ProgramData \ boundless \ OpenGeo ) avant de commencer ce didacticiel, par mesure de précaution.

4. Copiez le fichier ( jetty-servlets-7.6.13.v20130916.jar ) ( tel quel ) dans le répertoire jetty Lib
   ( * C: \ Program Files (x86) \ boundless \ OpenGeo \ jetty \ lib * ) également le répertoire peut changer selon votre répertoire d'installation.

5. Copiez et collez les lignes xml suivantes dans le ( webdefault.xml ) situé dans
   ( C: \ Program Files (x86) \ boundless \ OpenGeo \ jetty \ ect \ webdefault.xml ), je ne suis pas sûr que l'emplacement de ces lignes placer dans le fichier est important ou non mais je les colle à partir de la ligne # 306 après </serlet-mapping>.

<filter>
    <filter-name>cross-origin</filter-name>
    <filter-class>org.eclipse.jetty.servlets.CrossOriginFilter</filter-class>
</filter>
<filter-mapping>
    <filter-name>cross-origin</filter-name>
    <url-pattern>/*</url-pattern>
</filter-mapping>

6. Démarrez les services ( GeoServer , Postgres ), attendez quelques secondes et accédez à la page du géoserveur, le géoserveur démarrera correctement.

Ce tutoriel a fonctionné pour moi et j'espère que cela fonctionnera pour toute personne confrontée au même problème.

Le paramètre crossOrigin n'existe que (?) Pour ol.source.TileImage. ( http://openlayers.org/en/master/apidoc/ol.source.TileImage.html - décochez "Stable only" dans le coin supérieur droit). ol.source.GeoJSON n'a pas de paramètre crossOrigin, car vous ne pouvez pas accéder à JSON via une demande intersite.

Vous avez différentes manières de contourner cela:

1. utilisez un proxy web pour les appels ajax si vous n'avez pas accès au serveur, d'où provient le json. (Recherchez par exemple le proxy ajax)
2. vous pouvez utiliser jsonp si vous avez accès au serveur. C'est normalement la solution préférée, mais je ne sais pas si cela fonctionne avec geojson et vous devrez peut-être remplacer la fonction de chargeur ( http://en.wikipedia.org/wiki/JSONP - Comment obtenir JSON à partir de Geoserver en utilisant Demande AJAX - http://openlayers.org/en/master/examples/vector-osm.js <- un exemple d'utilisation d'une fonction de chargeur personnalisée)
3. activer les requêtes d'origine croisée sur le serveur. ( http://en.wikipedia.org/wiki/Cross-origin_resource_sharing )
4. si les données sont statiques, téléchargez-les et placez-les sur votre propre serveur (en mentionnant simplement pour l'exhaustivité)

problème similaire, mais pas lié à la géo: /programming/5549068/json-how-do-i-make-cross-domain-json-call

J'ai rencontré des erreurs CORS lors de l'utilisation des demandes GetFeatureInfo pour obtenir des informations d'une couche de géoserveur WMS dans ma carte OpenLayers.

Réponse à partir de mai 2020:

https://docs.geoserver.org/latest/en/user/production/container.html#enable-cors

Vérifiez les en-têtes de réponse Geoserver dans l'onglet Réseau Firebug / Chrome Dev Tools pour voir si l'en-tête Acces-Control-Allow-Origin: * est vraiment là. Sinon, le problème est du côté du conteneur de servlet. Ou peut-être, si l'application est interne, configurer un proxy sur le serveur Web principal plutôt que d'activer CORS? Ce dernier aurait plus de sens si votre Geoserver allait être accessible au public.

Mon problème CORS a été résolu par http://2carto.com/enable-cors-domain-geoserver-2-8/#comment-53 pour GeoServer 2.8. (inutile pour GeoServer 2.9)