基于华为开发者空间的荷联管理系统：星闪点阵笔实时笔迹可视化实现

1 概述

本案例由开发者：江苏润和软件股份有限公司提供

本案例依托华为开发者空间提供的cli工具包实现反向代理，将Web界面和后端部署到服务器上搭建荷联管理系统。用户可通过专属链接访问对应网址，实现对星闪点阵笔的远程升级、笔迹查看等功能。技术层面，该系统核心采用HTML与java搭建，本地反向代理负责请求转发与处理，确保界面呈现与数据处理的稳定运行。通过这种架构，既保留了本地开发的灵活性，又实现了服务的远程可访问性。 功能上，服务器聚焦实时数据展示，可动态呈现星闪网关和星闪点阵笔相关的关键数据，具体包括点阵笔的电量、当前版本、实时笔迹等。 从实践价值来看，通过该案例的搭建与应用，点阵笔将星闪信号快速传递给网关并同步在教师终端和管理后台展示，从而实现书写内容的数字化，让设备 “知道” 写了什么。可广泛用于智慧教育、智慧办公等多个领域。

1.2 适用对象

l 企业

1.3 案例时间

本案例总时长预计30分钟。

1.4 案例流程

1.开通开发者空间，创建云开发环境并进行操作；

2.进行云开发环境cli链接配置；

3.启动星闪网关；

4.建立初始22隧道，连接到远程开发环境；

5.启动服务，并建立所需的隧道用于网关数据传输和使用本地浏览器访问到远端web服务；

6.启动星闪点阵笔，在web界面查看点阵笔的实时状态和笔迹；

2 云开发环境创建

2.1 进入云开发环境

面向广大开发者群体，华为开发者空间提供可随时访问的“开发平台”、丰富的“预配置工具集合”及灵活调用的“场景化资源池”，开发者可开箱即用，快速体验华为根技术与资源。 开发者登录华为云账号后，可直接进入华为开发者空间开发平台界面，点击“云开发环境”即可进入对应页面。

注：首次进入云开发环境需签署协议，勾选协议后点击【进入】即可。
云开发环境管理页面如下：

2.2 云开发环境创建

在云开发环境页面，点击【新建云开发环境】弹出新建云开发环境配置窗口，按照要求输入【环境名称】、【开放端口（可选）】、【默认账号】、【密码】等，点击【确认】。

环境名称(必填)：自定义，可包含数字、字母、下划线，长度不超过15个字符，不能以数字开头。开放端口(可选)：非必填，默认22端口，可代理的端口范围 8080-8089。(本案例需要打开8080端口)
默认账号(必填):默认为developer，可自定义，4~16个英文小写字母，不可使用系统保留的用户名root、agent。密码(必填):自定义，8~32个字符,至少包含以下字符中的3种：大写字母、小写字母、数字和特殊字符，特殊字符仅支持~!@#$%^*-_=+?

创建成功后点击开机即可：

3 云开发环境配置

3.1 安装cli工具包

hdspace.exe是一款为开发者设计的cli工具包，开发者可以通过hdspace.exe完成开发者空间云开发环境在PC端的创建和管理，并且开发者通过该工具可以建立与云开发环境的隧道，进而实现对云开发环境的远程操作(上传下载文件、编码编译执行等)。

1.下载

在Web端创建的云开发环境上点击【远程连接】-【立即下载】，将cli工具包下载到本地。

2. 配置环境变量

以Windows11为例，在搜索栏搜索环境变量，或者在控制面板中找到环境变量，点击系统变量中的path，新增环境变量。
把hdspace.exe文件所在目录，添加到新增的环境变量中并保存确认。如下图所示：

3. 确认cli工具包安装成功

进入终端执行命令hdspace，查看安装结果。

hdspace

显示如下，则为安装成功。

至此，已经显示hdspace安装完成。

3.2 配置本地环境

在使用cli工具包创建和管理云开发环境之前，需要先在本地配置用户的AK/SK，获取用户远程操作权限，保证操作的安全性

1. 获取AK/SK

AK是Access Key（访问密钥）的缩写, 用于标识用户身份的唯一ID, 通常公开传输;
SK是Secret Key（秘密密钥）的缩写，用于生成请求签名的保密密钥，仅用户和服务端持有。其核心功能是通过对称加密机制验证请求发送者的合法性，防止未授权访问。
开发者配置AK/SK，等同于在cli中进行身份信息认证，从而可以在cli端对云开发环境进行操作。
可以参考获取AK/SK文档。

打开下载文件，AK/SK如下展示：

2. 配置AK/SK，输入命令

hdspace config

按照提示输入AK/SK，注意：SK输入后并不会回显，并且需要再次输入确认。

如上图显示，则配置AK/SK成功。

4 创建隧道链接

4.1 修改服务器IP

在浏览器界面输入星闪网关IP，进入网关配置界面，修改连接服务器IP为本地主机的IP。

4.2 创建链接远程环境22端口的隧道，用于本地ssh客户端登录远程环境

在终端输入hdspace devenv list 查询ID。

通过如下命令行建立链接远程环境22端口的隧道，与本地22端口连接。用于本地ssh客户端与远程环境连接。

hdspace devenv start-tunnel --instance-id=bd760c1d9bbf464282b1349a1d29592c --local-port=22

打开远程链接软件，输入ip地址（127.0.0.1）、云开发环境用户名、通道链接的端口号（这里是22），输入密码登录云开发环境。

4.3 启动web服务

1. 将前端和后端的文件复制到云开发环境中

2. 启动后端

在云环境终端输入

java -jar HL-CLINKS-V.1.0.7\(1\).jar

3. 启动前端

在云环境终端输入

python -m http.server 8081

4.4 建立新的隧道并在本地浏览器访问到远端web服务

web服务的前端和后端部署在远程华为云环境中，因此需要再新建三个隧道以保证数据能从星闪网关流向云开发环境，实现笔迹的实时显示。

1. 建立链接远程环境8080端口的隧道，与本地5612端口连接。作用是打通web后端和网关之间的数据通信，本地终端输入：

hdspace devenv start-tunnel --instance-id=bd760c1d9bbf464282b1349a1d29592c  --remote-port=8080 --local-port=5612 --local-addr=192.168.31.136

2. 建立链接远程环境8081端口的隧道，与本地8081端口连接。作用是让本地主机能够访问web前端页面，本地终端输入：

hdspace devenv start-tunnel --instance-id=bd760c1d9bbf464282b1349a1d29592c  --remote-port=8081 --local-port=8081

3. 建立链接远程环境8089端口的隧道，与本地8181端口连接。作用是打通web后端和web前端之间的数据通信，本地终端输入：

hdspace devenv start-tunnel --instance-id=bd760c1d9bbf464282b1349a1d29592c  --remote-port=8089 --local-port=8181

4. 打开本地浏览器在浏览器中输入http://localhost:8081，就可以打开荷联管理系统

5 启动星闪点阵笔，在web界面查看点阵笔的实时状态和笔迹

启动星闪点阵笔，等待连接完成后，点击web界面的全部笔迹按键，网页会切换到笔迹显示界面，在点阵纸上写字，网页上会同步显示笔迹。