Publish WMS with Geoserver and Openlayers from own server

Question

I`m struggling with my Geoserver resp. OpenLayers.

Environment: Ubuntu 1804, Tomcat8, Geoserver 2.13.2

I just want to publish vector and raster data from my own server. I can upload the files on my server and the Layers Preview is working correctly.

http://193.31.24.240:8080/geoserver/raster/wms?service=WMS&version=1.1.0&request=GetMap&layers=raster:500k_eng_fac&styles=&bbox=7.236923932667394,47.35615033439554,12.891923932667394,52.770837834395536&width=768&height=735&srs=EPSG:4326&format=application/openlayers#toggle

Also, the wfs-t example in the /www folder is working correctly.

http://193.31.24.240:8080/geoserver/www/wfs-t.html

But I can`t use any other map I tried the Simple Map Example from OpenLayers Example page, changed nothing but it is not working.

http://193.31.24.240:8080/geoserver/www/index.html

I tried about 15 different tutorials, the Projection system is clear EPSG:4326, checked the extent but I never get it running.

A normal HTML page is running so I assume my server is running and working. http://193.31.24.240:8080/geoserver/www/index_work.html

Answer 1

In your current Application, You have code like:

  import Map from 'ol/Map.js';
      import View from 'ol/View.js';
      import TileLayer from 'ol/layer/Tile.js';
      import OSM from 'ol/source/OSM.js';

You are facing a Problem, because Most Browsers don't understand this import statement. OL3 onwards, you need to use a Modern Javascript Toolchain, to build up the app, since OL3 is built on Modules.

So what should you do?

1)You should look at https://openlayers.org/en/latest/doc/tutorials/bundle.html

This page talks about how you can create an app using NPM. There are other help pages which talk of using webpack, RollUp, Parcel & Browserify as well as

2)If this is too complicated, just use Leaflet instead; leaflet is more user-friendly, and extremely accessible to beginners. What you want, can easily be done using these 2 tutorials: Quick Start & Using WMS