后端前端物联网工业制造数据可视化时序数据库【免费下载链接】FUXAWeb-based Process Visualization (SCADA/HMI/Dashboard) software项目地址https://gitcode.com/gh_mirrors/fu/FUXA点击查看免费下载FUXA 是一款基于 Web 的工业过程可视化软件用于快速构建与部署可扩展的 SCADA、HMI、Dashboard 和 IIoT 系统。本指南以官方文档 docs/index.md 为主线结合仓库中的服务端源码与配置文件系统讲解 FUXA 的软件模型、功能特性、全部安装方式、服务端配置要点以及从连接设备→配置 Tag→创建可视化视图→设置报警的完整项目构建流程。读完本文你将能够独立完成 FUXA 的部署并掌握在编辑器中搭建一套实时数据可视化 HMI 页面的实战方法。一、FUXA 是什么核心定位与软件模型FUXAFast Universal eXecution Architecture是一个功能强大的Web 化软件平台可用于快速构建和部署可扩展的 SCADA、HMI、Dashboard 或 IIoT 系统。借助 FUXA你可以为机器设备创建具有个性化设计的现代化过程可视化界面实现实时数据显示并对自动化工业装置进行控制操作。其软件模型非常简洁清晰服务端基于Node.js 运行时后端负责设备通信、数据处理、报警、历史存储DAQ与 API 服务前端你只需在 Web 浏览器中访问服务端地址即可打开编辑器来创建你的 SCADA/HMI/Dashboard 应用同时浏览器也作为客户端运行可视化页面。这与传统桌面版组态软件有明显区别——工程设计与运行环境全部在浏览器中完成天然支持跨平台。FUXA 支持常用的工业通信标准例如Siemens S7 协议和OPC UA可连接第三方 OPC 服务器并且支持的通信标准列表可以通过**开发额外的驱动Driver**进行扩展。这一点在服务端源码中有直接体现设备驱动按协议类型存放在 server/runtime/devices 目录下adsclient、bacnet、ethernetip、modbus、mqtt、opcua、s7 等而 设备管理器 在创建设备时会动态加载对应驱动若插件缺失会给出 plugin is missing! 的告警。用户界面两种视图FUXA 由两个不同的视图组成视图用途访问地址FUXA-editor编辑项目、设计可视化界面http://localhost:1881/editorFUXA-view展示可视化项目成果面向最终用户http://localhost:1881/home前端的路由定义可在 client/src/app/app.routing.ts 中查看home、editor、lab、device、alarms、scripts、recipes、reports、logs等页面均有对应的 Angular 组件其中编辑器等管理页面通过AuthGuard保护启用安全模式后需要登录。二、功能特性免运行时授权FUXA不需要任何运行时许可证runtime licenses。你可以任意数量、任意规模地构建 HMI 项目而无需担心运行时环境的额外授权费用。这对于中小型自动化项目、系统集成商和教育科研场景非常友好。支持的通信协议FUXA 平台内置了与 Siemens PLC 和 OPC UA 数据源直接通信的连接器并支持多种工业协议OPC UA 客户端连接 OPC UA 数据源含第三方 OPC 服务器S7 协议通过以太网与 Siemens CPU 200、300、400、1200 和 1500 通信Modbus RTU/TCP、BACnet IP、MQTT、Ethernet/IPAllen Bradley、WebAPI。此外从仓库内容看README.md 中还列出了 ODBC、ADSclient、GPIORaspberry、WebCam、MELSEC、Redis 等连接方式服务端对应驱动位于 server/runtime/devices 各子目录。跨平台全栈架构系统设计为可在多种操作系统上运行且安装简单后端Node.js 开发前端可扩展的 HTML5 Web 前端使用 Web 技术HTML5、CSS、JavaScript、Angular、SVG开发兼容所有现代浏览器。该架构使得 FUXA 可以在 Linux、Windows、macOS、Docker、Raspberry Pi 等环境中运行前后端职责分离清晰。三、安装与运行本节综合 安装与运行指南 与 README.md 中的全部安装途径逐一说明。安装完成后默认通过浏览器访问http://localhost:1881或宿主机 IP:1881。方式一Electron 预构建桌面应用FUXA 提供 Electron 打包的桌面应用需要登录 GitHub 后在 Actions 构建产物中下载对应系统的安装包。这种方式适合不希望依赖浏览器、需要独立桌面窗口的部署场景。方式二Headless 便携二进制嵌入式设备针对无 GUI 的嵌入式设备、服务器或自动化系统FUXA 提供自包含的便携二进制文件将整个应用服务端 客户端打包为单个可执行文件无需安装任何外部依赖。平台对应的文件名如下平台文件名Linux (x64)fuxa-headless-linux-x64Linux (ARM)fuxa-headless-linux-arm64Windowsfuxa-headless-win-x64.exemacOS (Intel)fuxa-headless-macos-x64macOS (Apple Silicon)fuxa-headless-macos-arm64Linux/macOS 下的运行方式chmod x fuxa-headless-linux-x64 ./fuxa-headless-linux-x64 # 浏览器访问 http://localhost:1881Windows 下直接双击.exe文件即可。Headless 版本的关键特性自包含无外部依赖或额外安装数据持久化用户数据存储在宿主机的~/.fuxa-headless-data目录跨平台支持 Windows、macOS、Linux含 ARM 架构完整工业协议支持 Modbus、OPC-UA、MQTT、Siemens S7 等Web 界面通过任意浏览器访问完整的 FUXA 编辑器与仪表盘。故障排查确保 1881 端口未被占用且未被防火墙拦截嵌入式设备需关注内存与 CPU 资源FUXA 使用 Node.js 运行时日志位于~/.fuxa-headless-data/logs。方式三Docker Compose仓库根目录提供了现成的 compose.yml桥接网络模式。官方文档中的 host 网络模式示例version: 3.5 services: fuxa: image: frangoteam/fuxa:latest network_mode: host volumes: - ./fuxa_appdata:/usr/src/app/FUXA/server/_appdata - ./fuxa_db:/usr/src/app/FUXA/server/_db - ./fuxa_logs:/usr/src/app/FUXA/server/_logs environment: - TZAmerica/New_York restart: always启动命令sudo docker compose up -d说明host 网络模式让容器与宿主机处于同一网络便于直连 PLC/数据库但仅适用于 Linux 系统Windows 上需改用network_mode: bridge桥接模式。方式四Docker 单容器运行docker pull frangoteam/fuxa:latest docker run -d -p 1881:1881 frangoteam/fuxa:latest如需持久化应用数据项目、DAQTag 历史、日志与资源图片可挂载以下数据卷docker run -d -p 1881:1881 \ -v fuxa_appdata:/usr/src/app/FUXA/server/_appdata \ -v fuxa_db:/usr/src/app/FUXA/server/_db \ -v fuxa_logs:/usr/src/app/FUXA/server/_logs \ -v fuxa_shapes:/usr/src/app/FUXA/client/assets/lib/svgeditor/shapes \ -v fuxa_images:/usr/src/app/FUXA/server/_images \ frangoteam/fuxa:latest各卷对应服务端运行时目录这些目录在 server/main.js 中由_appdata、_db、_logs、_images等配置派生。方式五从源码构建自定义 Docker 镜像仓库根目录的 Dockerfile 采用三段式构建Angular 客户端构建 → 服务端及原生依赖构建 → 精简运行镜像支持两个构建参数NODE_SNAP默认false是否安装 node-snap7Siemens S7 通信INSTALL_ODBC默认true是否安装 ODBC 驱动unixodbc、MySQL/MSSQL 驱动等。构建并运行自定义镜像wget https://raw.githubusercontent.com/frangoteam/FUXA/master/Dockerfile sudo docker build -t fuxa-custom-image-name --no-cache .随后可在 compose 文件中使用image: fuxa-custom-image-name替换官方镜像。方式六NPM 全局安装需要先安装Node.js 18FUXA 1.2.7 起不再支持 Node.js 14 及更早版本npm install -g --unsafe-perm frangoteam/fuxa fuxaLinux 提示在 Linux 上使用 Node.js 18 安装可能遇到原生依赖编译问题如果不需要通过 S7 与 Siemens PLC 通信可以安装精简版frangoteam/fuxa-min不含 node-snap7。方式七源码发行包安装下载最新发行包并解压后cd ./server npm install npm start同样地若不需要 S7可先从server/package.json中移除node-snap7不需要外部数据库连接时还可移除odbc依赖以减少 Linux/Raspberry Pi 上的编译负担。服务端命令行参数直接运行服务端可执行文件时支持以下命令行选项定义于 server/main.js选项说明-p, --port PORT指定监听端口-u, --userDir DIR指定用户数据目录-?, --help显示帮助信息node main.js --port 3000 --userDir /path/to/fuxa-data端口与用户目录也可以在_appdata/settings.js中配置详见下文第四节。服务端默认监听0.0.0.0:1881。将 FUXA 设置为 HMI 终端Linux如需用 Electron 替代浏览器作为 HMI 前端更轻量、更适合触摸屏可禁用右键菜单等可参考以下流程安装与运行指南 中给出仅 Linux 环境验证过安装 Node.js 18 与 Electron创建 Electron 项目main.js指向已运行的 FUXA Web 服务器const { app, BrowserWindow } require(electron); function createWindow() { const win new BrowserWindow({ fullscreen: true, // 全屏模式 webPreferences: { nodeIntegration: false, contextIsolation: true, } }); win.loadURL(http://localhost:1881); // 指向 FUXA Web 服务器 } app.whenReady().then(createWindow);通过 systemd 用户服务实现开机自启ExecStart/opt/fuxa-electron-startup.sh指向启动脚本并用systemctl enable --user fuxa-electron-startup.service启用。反向代理部署BASE_PATH当 FUXA 部署在反向代理之后时可通过环境变量BASE_PATH指定带尾斜杠的自定义路径例如要在foo.bar/fuxa下提供服务设置BASE_PATH/fuxa。服务端在 server/main.js 中会在内存中改写index.html的base href与静态资源引用路径无需修改源码即可工作。四、服务端配置详解配置文件位置与加载机制FUXA 的服务端配置位于server/_appdata/settings.jsWindows 下为server\_appdata\settings.js。从 server/main.js 的启动逻辑可以看到首次启动时若_appdata/settings.js不存在服务端会把代码内置的默认配置 server/settings.default.js 复制过去若已有配置文件但版本落后会从默认配置深度合并缺失字段并给出告警。修改配置后必须重启服务端才能生效。关键配置参数以下参数均以 server/settings.default.js 为准参数默认值说明uiPort1881可用环境变量PORT覆盖FUXA Web 服务器监听的 TCP 端口uiHost0.0.0.0监听地址设为127.0.0.1仅本机访问设为::监听所有 IPv6 地址logDir_logs日志目录dbDir_dbDAQ、用户等数据库存储目录daqEnabledtrue是否启用 DAQTag 历史数据存储daqTokenizer24DAQ 数据库文件按小时分片归档0 表示禁用仅保留单个数据库文件broadcastAllfalse为true时所有 Tag 值广播到前端为false时仅广播当前可视化视图绑定的 Tag利于大规模项目性能lazyViewLoadingfalse前端按需加载 HMI 视图为true时启动仅下发视图元数据打开视图时才加载内容allowedOrigins[http://localhost, http://127.0.0.1, http://192.168.*, http://10.*, http://localhost:4200]CORS 允许的源支持*通配符生产环境建议使用精确源地址logApiLeveltinyHTTP 请求日志级别dev/combined/common/short/tiny/noneapiRateLimitWindowMs/apiRateLimitMax300000/1000API 限流窗口与最大请求数authRateLimitWindowMs/authRateLimitMax300000/100登录/刷新接口的限流参数heartbeatIntervalSec10心跳间隔秒1–20webcamSnapShotsDir_webcam_snapshotsWebCam 抓拍输出目录webcamSnapShotsCleanupfalse是否按保留天数清理旧抓拍webcamSnapShotsRetain7抓拍保留天数swaggerEnabledfalse是否启用 Swagger API 文档/api-docs依赖 swagger-ui-express 与 yamljsnodeRedEnabledfalse是否启用内置 Node-RED 集成nodeRedAuthModesecureNode-RED 访问模式secure需认证或legacy-open无认证认证与安全配置在 server/settings.default.js 中安全相关的参数均为注释状态按需启用secureEnabled: true, // 启用/禁用安全认证 secretCode: strong-random-secret, // 用于编码 Token 的密钥 tokenExpiresIn: 1h, // Token 过期时间1h1小时, 6060秒, 1d1天 // enableRefreshCookieAuth: false, // 为 true 时使用 HttpOnly Cookie 刷新令牌流程 // refreshTokenExpiresIn: 7d // 刷新令牌过期时间启用安全模式后默认用户admin的初始密码为123456可在用户管理中修改。从 server/main.js 的源码可以看到若启用secureEnabled却未设置secretCode服务端会在内存中生成随机 JWT 密钥并告警提示应将其持久化到配置中以保证重启后会话稳定。五、从零构建你的第一个 HMI 项目本节以 快速入门教程 为主线目标是演示 FUXA 最常用功能的完整流程连接设备 → 数据推送 → 构建实时 GUI SCADA/HMI/Dashboard → 定义阈值并触发报警。前置条件FUXA 服务端已按上文第三节完成安装并运行通过http://localhost:1881可访问同时具备设备凭据如 Modbus 从站地址、OPC UA 端点等。Step 1连接设备并配置 Tag在编辑器左侧菜单进入Connections连接即可添加设备详见 设备与 Tags 配置指南。OPC UA 设备添加并连接 OPC UA 设备后即可在其地址空间下浏览并订阅 Tag只有设备处于已连接状态才能添加 TagModbus 设备需要先在Plugins插件中安装 Modbus 驱动再进行连接配置MQTT 设备添加 MQTT 连接后配置主题Topic订阅即可接收订阅主题发布的数据WebAPI 设备添加 WebAPI 连接后可把 HTTP JSON 响应中的字段映射为 Tag。从服务端源码看设备一旦配置为启用状态设备管理器 会在服务启动时加载并启动所有活动设备设备内部通过bindSaveDaqValue把实时值写入 DAQ 存储同时通过bindGetProperty供报警、脚本等模块查询 Tag 属性。Tag Options数据类型与 Scale 脚本对于没有预定义数据类型的 Tag例如 TIME 类型其基础数据类型通常是 int64/uint64单位为毫秒可以在Tag OptionsTag 选项中设置数据类型。还可以使用Scale 脚本完成任意数据类型转换。例如当数据源返回的 TIME 是高低位组成的数组时可以编写一个脚本取出数组元素并作为数值返回写操作时再返回真实的 Tag 值。需要注意两点脚本参数必须命名为value——系统会以此过滤并显示相关脚本供选择脚本中不要使用注释因为注释不受支持。脚本的读写转换机制与 FUXA 脚本引擎相关脚本列表与权限配置可参考 scripts 模块 相关组件。Step 2创建可视化视图Step 2.1 创建空白视图进入编辑器点击左上角图标选择Canvas/SVG新建视图详见 创建 View 指南。随后点击Property属性定义视图的尺寸与背景。视图属性配置组件为 view-property编辑器主逻辑见 editor.component.ts。Step 2.2 绑定控件将控件按钮、指示灯、数值、滑块、开关等拖入视图并绑定到已配置的 Tag实现实时数据显示与交互控制参考 绑定控件指南。Step 2.3 绑定形状SVG 形状管道、阀门、泵等可与 Tag 绑定实现动态状态显示与动画参考 绑定形状指南。Step 2.4 绑定图表控件将历史/实时数据以图表形式呈现参考 图表控件指南。Step 3配置 UI 布局为最终用户界面配置导航、页眉等布局参考 UI 布局指南。Step 4配置报警Alarms定义 Tag 的阈值条件并触发报警报警发生后可在报警视图/alarms中确认参考 报警配置指南。Step 5创建客户用户在用户管理中创建客户账号结合第四节中的认证配置为最终用户提供受限的访问权限。六、运行时架构纵深设备管理与数据流为了让读者对设备 → 数据 → 可视化的链路有源码级认识这里补充设备管理器 server/runtime/devices/index.js 的核心设计设备生命周期load()从项目配置读取全部设备按enabled状态决定是否创建实例start()/stop()/update()/removeDevice()分别对应启动、停止、更新与移除其中 ModbusRTU 设备还会按串口地址分组共享通信资源sharedDevices插件缺失处理当某设备类型对应的驱动插件未安装时设备被记入failedDevices连接状态上报为connect-failed前端插件页面会显示相应告警Tag 读写 APIgetTagValue/setTagValue/getTagId/getDevice等函数供报警引擎与脚本引擎调用getHistoricalTags从 DAQ 存储按时间区间查询历史数据DAQ 绑定在daqEnabled开启时每个活动设备绑定 DAQ 节点实时值自动写入历史存储默认 SQLite也支持 InfluxDB、QuestDB、TDengine 等见 server/runtime/storage。配合前端的 Angular 路由app.routing.ts/home用于最终用户查看可视化页面/editor用于工程设计与编辑两者共享同一套服务端 API这正是 FUXA一个运行时、两种视图架构的具体体现。结语FUXA 通过 Node.js 运行时与 Angular/HTML5/SVG 前端组合将 SCADA/HMI 工程的编辑、运行与设备接入统一到了 Web 环境中。从本文可以看到其免授权特性降低了 HMI 项目成本内置的 OPC UA、S7、Modbus、MQTT 等多协议驱动覆盖了主流工业数据源Docker、Headless 二进制、NPM 等多种部署方式适配了从云服务器到嵌入式设备的各类场景。接下来建议你结合 官方文档目录 中列出的其余指南Getting-Started.md、Settings.md 及各 HowTo 文档在真实设备或仓库自带的 project.demo.fuxap 示例项目上动手实践逐步掌握 FUXA 的完整工程能力。赞分享后端前端物联网工业制造数据可视化时序数据库【免费下载链接】FUXAWeb-based Process Visualization (SCADA/HMI/Dashboard) software项目地址https://gitcode.com/gh_mirrors/fu/FUXA点击查看免费下载相关推荐工业级Web可视化平台FUXA从零构建SCADA/HMI系统的完整指南工业级Web可视化平台FUXA从零构建SCADA/HMI系统的完整指南 FUXA作为一款全栈Web可视化解决方案专为工业自动化场景设计通过纯浏览器操作实现后端前端物联网工业制造数据可视化时序数据库FUXA开源SCADA系统终极指南快速构建工业可视化监控平台FUXA开源SCADA系统终极指南快速构建工业可视化监控平台 在工业自动化领域FUXA开源SCADA系统正以其强大的工业可视化监控能力为工程师们提供从数据后端前端物联网工业制造数据可视化时序数据库如何快速搭建工业级Web可视化系统FUXA开源SCADA/HMI工具的终极指南 如何快速搭建工业级Web可视化系统FUXA开源SCADA/HMI工具的终极指南 FUXA 是一款功能强大的Web based工业过程可视化软件支持SC后端前端物联网工业制造数据可视化时序数据库上一篇Snowpack TypeScript 类型检查插件 snowpack/plugin-typescript 完整指南下一篇Cherry Studio Agent 创建默认值变更解析permission_mode 与 Soul 模式的默认行为调整创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考