WEBGIS：从创建空间数据库、发布数据到调用WMS服务全栈演示

优质文章学习记录

09 Apr 2026 — 11 min read

一、将shp数据导入到postgis数据库

安装所需要的软件和环境，需要PostgreSQL数据库文件创建和存储软件和postgis空间数据导入工具软件：以下是我安装的相关软件的版本，安装的版本首选稳定性

Postgresql15：用于创建数据库和管理数据 下载网址（https://www.postgresql.org/download/）

Postgis-bundle-pg15：用于导入具有空间属性的数据到创建的数据库里面，根据Postgresql的版本来下载相对应的版本。
下载网址（https://www.postgresql.org/download/）

打开postgresql软件下面的pgmin模块，输入密码（该密码就是安装该软件的时候设置的密码）
刷新网址就可以看到软件界面都变成中文显示
创建数据库：右键左边栏的数据库然后创建一个新的数据库，数据库命名，然后选择数据库的用户（postgres），创建好数据库之后还没有结束
数据确定导入：设置好SRID后点击导入，导入成功之后就可以使用pgmin软件打开数据库然后进行SQL语句查询

连接数据库：点击最上方的【View connection details…】选项然后填写导入的目标数据库相关信息

图表 1：该表是一个示例，第一个是数据库拥有者的名字，第二个是数据库的密码，第三个是默认的，最后一个是自己创建的数据库的名字

空间数据导入到SQL数据库：首先打开安装的postgis软件中的（PostGIS Post Boundle 1 for PostgreSQL *64 15Shapefile and DBF Loader Exporter）模块，然后点击添加文件，将需要导入的矢量文件选中，然后就可以看到这个界面：

接下来要设置里面的SRID码，该代码就是指代该空间数据的地理或投影坐标系的编号，我们可以使用Arcmap软件打开该矢量数据，然后查看该数据属性（源）就可以获取该矢量数据的SRID码

创建数据库拓展服务：选中新建的数据库，然后点击：

该功能框进入到数据库查询界面，在该界面输入：create extension postgis；然后点击运行按钮（▶）就可以启动拓展服务

设置软件中文显示：

二、将postgis数据库中的数据发布成标准地图服务

需要安装的软件或者应用有：

1.1先安装Java的运行环境（安装可以存放到D盘），安装结束后可以配置运行路径，然后打开cmd（win + r）输入：java -version
1.2然后安装 Tomcat服务器，该安装路径要与Java的安装路径是一致的，安装过程中需要注意的是有一个安装用户和密码的设置，后续使用tomcat登录服务器访问geosever服务然后登陆使用的账号就是这个

访问localhost:8080端口查看是否可以成功访问

1.3安装geosever：将【geosever.war】压缩包文件裁剪然后粘贴到(./Tomcat7.0/webapps)的目录下就可以了，粘贴后会自动出现一个geosever文件夹（或者可以手动解压到该文件夹目录下）至于该安装包的下载可以直接访问

geosever官网https://geoserver.org/download/

Figure ：以上是我下载的相应软件的版本安装包和压缩包2. 安装所需的软件之后我们可以基于以下两个步骤来访问到geosever网站

2.1步骤一：访问tomcat软件的端口localhost:8080，然后在该网页点击【ManageApp】输入账号和密码（这里的信息就是安装tomcat是设置的账号和密码，一般为admin和123456），进去管理员的界面，我们要点击启动geosever，启动服务。

2.2步骤二：直接输入网址：

http://localhost:8080/geoserver/web/

就可以跳转到geosever网址（当然这两种方法都是在已经启动tomcat服务器的前提下），进入网址之后也要登录用户（这里登录的与tomcat那里登录的用户和密码是一样的）

添加新的数据存储：点击【数据存储】，然后点击【添加新的数据存储】，在对话框里面选择要导入的数据类型的数据库，我们导入的是矢量数据，所以
将里面的数据库数据添加到新的数据工作区，这里选择postgis来导入矢量数据
接下来还要设置几个参数：

>这一张示意截图不是我自己创建的，这个是我在网上学习的时候顺便截的，是B站的一名技术博主，如果有侵犯权益联系我删除

Geosever创建新的工作区：点击左边菜单栏的【工作区】，然后点击【添加新的工作区】，给新建的工作命名，命名空间也是随便（有一定格式），除此之外还要选择服务（这里选择WMS和WFS服务，WFS服务开启方便后续进行数据动态更新和修改与序列化），最后可以点击【提交】

4.1工作区：选择刚刚新建的工作区
4.2数据源名称：这里是自己新命名一个新的名称（建议英文）
4.3database：选择要导入的数据库（本次在postgreSQL 15新建的数据库名称）
4.4user：数据库的拥有者，一般为posgres
4.5passwd：数据库的密码（就是在pgmin那里新建的数据库的密码123456）

出现问题：通过导入数据库的形式来发布数据库的空间数据但是没有自动跳转到发布的界面，这时候你需要确定新建的工作区是否选择服务，确定选择服务了之后就点击左边菜单栏的【服务】里面的【WMS】，然后再此界面选择新建的工作区，就可以发布连接的数据库里面的数据表作为新图层了

数据预览：点击左边菜单栏的【layer view】，然后找到自己的工作区，点击添加的图层名称就可以预览数据啦

如果没有发布选项，我们可以点击左边菜单栏下的【数据】目录下的【图层】选项，然后再点击【添加新的资源】，再选择新建的工作区导入的数据库作为新的图层，就可以看到成功导入的postgis数据库下面的数据表，然后依次点击发布即可（发布里面的设置按照上面的示例）

设置好之后就可以点击【保存】，然后点击【发布】，点击发布还会进入到设置阶段，在这里需要设置边框数据（一般是自动计算出来），计算出来之后就可以点击保存了

三、使用OpenLayers调用wms服务加载发布地图

具体实现效果：可以使用open layers地图框架在浏览器应用上面调用Geosever发布的地图服务。
打开geosever管理客户端：localhost:8080/geosever/web，点击图层栏然后先选择要导入的图层（这些图层都是已经提前发布好的了）
调用WMS数据源的语法结构：

//WMS图层 - ImageLayer类型(先增加数据源然后增加数据图层)const WMSsource =newImageWMS({url:'http://localhost:8080/geoserver/WEBsevse/wms',params:{'LAYERS':'WEBsevse:bou2_4p','VERSION':'1.1.0','FORMAT':'image/png','TRANSPARENT':true,'SRS':'EPSG:4326','STYLE':''},serverType:'geoserver',crossOrigin:'anonymous',ratio:1});const WMSLayer =newImageLayer({source:WMSsource,opacity:0.7,visible:true})