如何通过frp、geoserver发布家里电脑的空间数据教程

如何通过家里电脑的geoserver发布空间数据的教程

简介

大家好，我是锐多宝，最近我在开发一个新网站的时候遇到一个需求，这里记录一下以帮助需要用到的网友。

我的需求是：用户通过网站前端上传空间数据后，即可在前端展示影像。需要注意，我的geoserver和网站后端都部署在家里的电脑上。具体需求如下：

（1）发布图层

通过我自己家里的电脑发布geoserver的图层；

（2）域名访问

用户需要通过域名访问图层；

（3）SSL证书配置

图层的域名需要进行https加密；

（4）前后端交互开发

实现上面的步骤后，开发前端和网站后端实现：用户上传数据，服务端自动发布数据并返回wmts。

我画了一个简单的流程图展示相关的实现过程：

流程图

windows端geoserver的安装

windows端安装geoserver按照官网的要求安装即可，先下载geoserver的安装包以及对应版本的java，安装java，配置java环境，再安装geoserver。

（1）下载geoserver安装包和对应版本的java

进入官网（https://geoserver.org/download/），下载最新的geoserver安装包：

下载java版本的时候需要注意版本，geoserver提供了版本参考，这里我强烈推荐使用java 11，而不是java 17（因为java17我安装了好几次，但geoserver运行始终有bug，换成java 11才稳定下来）。java版本参考网站:https://docs.geoserver.org/main/en/user/production/java.html

知道了java版本，就到甲骨文公司的官网下载所需的java11安装包，进入网站（https://www.oracle.com/java/technologies/downloads/）下载：

（2）安装java

一路点击安装和下一步即可，记住安装路径，比如我是C:\Program Files\Java\jdk-11。

等待安装完毕之后，打开环境变量编辑，配置java的环境变量：

在系统变量中点击新建，配置变量名：JAVA_HOME，路径是你的安装路径，我的是：C:\Program Files\Java\jdk-11。

然后点击系统变量的Path

在Path中，配置下面的路径：%JAVA_HOME%\bin

配置后之后，在powershell中输入：java -version 。安装成功后的输出如下所示：

（3）安装geoserver

一直点击下一步即可，没有说明安装难度。需要注意，最后选择服务启动选择方式：不要选择以服务启动，选择手动启动。安装完成后，进入geoserver的bin目录。

调出powershell，启动starup.bat：

使用**.\startup.bat** ，即可启动成功。在浏览器端输入网址：http://localhost:8080/或者http://127.0.0.1:8080/访问。用户名：admin，密码：geoserver，即可进入管理界面。

（4）使用geoserver发布图层

创建一个新的工作空间用来发布数据，比如我创建了一个ruiduobao的空间：

然后在这个空间设置wmts，

发布一个全国DEM数据试一试效果：

可以看到发布的数据打开开发者界面，是一个wmts瓦片，到此geoserver安装成功。

内网穿透安装

内网穿透是一种技术手段，它允许外部网络（如互联网上的计算机）能够穿过 NAT（网络地址转换）或防火墙访问内网（局域网）中的服务。这在你需要从任何地方远程访问位于内网的某台计算机或设备时非常有用，比如访问内网的 Web 服务器、远程桌面、数据库等。

frp工作原理示意图

FRP 是一个高性能的反向代理应用，用于帮助用户实现内网穿透（请参考：https://github.com/fatedier/frp，该项目的标星已超过7w）。FRP 主要由两部分组成：

frps：即 FRP 服务端，部署在具有公网 IP 的服务器上。
frpc：即 FRP 客户端，部署在需要进行内网穿透的内网机器上。

现在我们开始frp的服务器、客户端的安装以及通过frp连接服务器端和客户端。

内网穿透的服务器端安装

首先大家先进入frp的官网https://gofrp.org/，里面有详细的安装和使用教程：

首先是安装，进入网站：https://github.com/fatedier/frp/releases 下载最新版的frp，

将 frps 复制到拥有公网 IP 地址的机器上，并将它们放在任意目录。然后编辑frps.toml文件。大家可以参考我的编写，

每个人的情况不一样，frps的配置尽量查看官网（https://gofrp.org/zh-cn/docs/examples/vhost-http/），里面有详细的配置说明：

配置文件完成后，输入*./frps -c ./frps.toml*启动服务。

查看frps的运行情况，输入systemctl status frps即可：

内网穿透的客户端安装

进入网站：https://github.com/fatedier/frp/releases 下载适合自己的电脑的windows版本（大部分电脑都是amd64）。

配套服务器端frps，编写frpc的配置文件，比如我的就是这样。请参考官网，配置自己的toml文件，一般来说配置好服务器的地址、端口，本地的网络监听端口和网络连接类型即可。serverPort是frps的服务器开放端口，需要在云服务厂商开放7000端口，并且在云服务器的防火墙设置上也开放7000端口。

然后输入

./frpc -c ./frpc.toml

serverAdd是服务器ip，serverPort是frps的服务器开放端口，localport 是你内网中运行 web 服务的端口。customdomains 应该和服务端配置中的一致。启动客户端即可。服务器端口设置为自己的geoserver端口，比如8080，域名为你打算部署的域名。

图层的域名配置和https加密

宝塔面板新建一个网站，域名是frp的代理域名，比如我的代理域名就是frp2.ruiduobao.cn：

因为域名访问的一般是80端口，我们需要将域名重定向为fpr的代理网站端口，我的代理端口是7501：

设置完成后，已经可以通过域名访问本地的geoserver服务了，但此时是http连接。我们需要配置一个https。前往云服务商申请一个SSL证书，将证书部署到宝塔面板中：

配置网站的SSL

输入frp代理的域名，即可访问geoserver的管理界面，并且已经是https。

选择一个本地geoserver发布的图层的wmts链接，随意选择一个瓦片，将地址转为frp的代理地址，加载到浏览器中，此时即可以通过https访问本地服务器发布的geoserver法服务。

后端自动发布geosever图层

当接受到用户的上传文件后，可以写一个后端的函数，将文件通过geoserver自动发布，并返回一个wmts链接。开始之前，可以看看电脑上的geoserver的rest接口网站：

在收到用户文件后，可以先连接geoserver，然后将文件推送到geoserver的数据目录，再发布即可实现自动发布geoserver数据。我写了一个express的后端代码可以参考:

// 调用geoserver参数
let geoserver_Url = process.env.geoserver_Url;
const geoserver_username = process.env.geoserver_username;
const geoserver_password = process.env.geoserver_password;
const geoserver_workspace = process.env.geoserver_workspace;
const geoserver_publish_directory = process.env.geoserver_directory;
const geoserver_directory = process.env.geoserver_directory;//创建栅格通过geoserver发布的路由
const publishRasterData = async (workspace, storename, coverageName, filePath) => {// 这里需要根据实际的用户名和密码进行替换const username =geoserver_username; const password =geoserver_password;const geoserverUrl =geoserver_Url;const data = fs.readFileSync(filePath);// 设置基本认证信息const auth = { username, password };//数据上传到指定的工作区await axios.put(`http://localhost:8080/geoserver/rest/workspaces/${workspace}/coveragestores/${coverageName}/file.geotiff`,data, // 上传文件的二进制数据{headers: {'Content-Type': 'image/tiff' // 设置正确的内容类型},auth: auth});// 构建WMTS服务链接const wmtsLink =geoserver_Url+`/${workspace}/gwc/service/wmts?layer=${workspace}%3A${coverageName}&style=&tilematrixset=EPSG%3A4326&Service=WMTS&Request=GetTile&Version=1.0.0&Format=image%2Fjpeg&TileMatrix=EPSG%3A4326%3A7&TileCol=214&TileRow=37`return wmtsLink;                
}