ARTICLE DETAIL

资讯详情

深耕网站建设与运营推广的一线实战洞察。

MQTT Explorer 浏览器模式 Docker 部署指南:从快速启动到生产级安全加固

MQTT Explorer 浏览器模式 Docker 部署指南:从快速启动到生产级安全加固 开发工具物联网消息队列【免费下载链接】MQTT-ExplorerAn all-round MQTT client that provides a structured topic overview项目地址https://gitcode.com/gh_mirrors/mq/MQTT-Explorer点击查看免费下载MQTT Explorer 是一款提供结构化 Topic 总览的 MQTT 客户端除了传统的 Electron 桌面应用外它还支持以浏览器模式运行由一个 Node.js 服务端托管 Web 前端用户只需打开浏览器即可完成 MQTT 消息的订阅、发布与可视化。本文以仓库中的 DOCKER.md 为主线完整讲解如何通过 Docker 镜像快速部署 MQTT Explorer 浏览器模式、全部环境变量的含义与源码级实现、认证机制、数据持久化、从源码构建镜像的流程以及生产环境的安全加固方案。读完本文你将能够独立完成从一条命令跑起来到带 HTTPS 反向代理 认证 LLM 助手的完整生产部署。浏览器模式与 Docker 化的背景MQTT Explorer 的浏览器模式由仓库根目录的 BROWSER_MODE.md 系统阐述服务端基于 Express Socket.io 构建前端通过 WebSocket 与后端实时通信。与 Electron 模式使用 IPC 不同浏览器模式使用 Socket.io 的 WebSocket 通道二者实现了相同的EventBusInterface因此应用代码在两种模式下无需修改即可运行相关事件总线实现见 events/EventSystem/EventBusInterface.ts 与 events/EventSystem/SocketIOServerEventBus.ts。浏览器模式带来了几个天然优势免安装任何现代浏览器打开即用跨平台Windows、macOS、Linux、移动设备均可访问远程访问可部署到服务器上供多用户使用多用户认证服务端内置用户名/密码认证支持企业化接入。Docker 镜像正是为了把这些优势转化为一条命令即可部署的产物。官方镜像托管在 GitHub Container Registryghcr.io/thomasnordquist/mqtt-explorer支持多架构linux/amd64、linux/arm64、linux/arm/v7方便在 x86 服务器、Raspberry Pi 和 Apple Silicon 等设备上直接运行。快速开始三种启动方式方式一使用预构建镜像docker run拉取并运行最新镜像docker pull ghcr.io/thomasnordquist/mqtt-explorer:latest docker run -d \ -p 3000:3000 \ -e MQTT_EXPLORER_USERNAMEadmin \ -e MQTT_EXPLORER_PASSWORDyour_secure_password \ -v mqtt-explorer-data:/app/data \ --name mqtt-explorer \ ghcr.io/thomasnordquist/mqtt-explorer:latest启动后访问http://localhost:3000使用环境变量中设置的账号密码登录即可。方式二使用 Docker Compose仓库根目录的 docker-compose.yml 给出了一个可直接使用的编排文件。也可以按 DOCKER.md 的示例自建version: 3.8 services: mqtt-explorer: image: ghcr.io/thomasnordquist/mqtt-explorer:latest ports: - 3000:3000 environment: - MQTT_EXPLORER_USERNAMEadmin - MQTT_EXPLORER_PASSWORDyour_secure_password - PORT3000 volumes: - mqtt-explorer-data:/app/data restart: unless-stopped volumes: mqtt-explorer-data:然后执行docker-compose up -drestart: unless-stopped保证容器在异常退出后自动重启适合长期运行。仓库自带的 docker-compose.yml 还额外内置了健康检查配置见下文健康检查一节与镜像的HEALTHCHECK指令互为补充。方式三从源码本地构建如果你想在最新源码基础上构建自己的镜像使用浏览器模式的专用构建文件docker build -f Dockerfile.browser -t mqtt-explorer:local .运行本地构建的镜像docker run -d \ -p 3000:3000 \ -e MQTT_EXPLORER_USERNAMEadmin \ -e MQTT_EXPLORER_PASSWORDsecret \ mqtt-explorer:local环境变量完整说明DOCKER.md 给出了完整的配置项表格。结合 src/server.ts 的源码可以确认这些变量在服务端启动时的实际消费逻辑PORT、CREDENTIALS_PATH、ALLOWED_ORIGINS、UPGRADE_INSECURE_REQUESTS、X_FRAME_OPTIONS等均在文件开头读取process.env。核心运行配置变量必填默认值说明MQTT_EXPLORER_USERNAME否自动生成认证用户名MQTT_EXPLORER_PASSWORD否自动生成认证密码MQTT_EXPLORER_SKIP_AUTH否false设为true关闭认证仅可在安全代理后使用PORT否3000服务端监听端口ALLOWED_ORIGINS否*允许的 CORS 来源逗号分隔NODE_ENV否-生产部署设为productionUPGRADE_INSECURE_REQUESTS否false设为true启用 CSP 的upgrade-insecure-requests指令。仅当部署在带有效 SSL 证书的 HTTPS 反向代理nginx、Traefik 等之后使用。它会将所有 HTTP 请求升级为 HTTPS启用后会破坏直接的 HTTP 访问。X_FRAME_OPTIONS否false设为true启用X-Frame-Options: SAMEORIGIN头以防范点击劫持。启用后会禁止 iframe 嵌入。关键变量的源码级实现PORT在 src/server.ts 中读取const PORT process.env.PORT || 3000最终作为server.listen(PORT)的监听端口ALLOWED_ORIGINS在 src/server.ts 中按逗号切分为数组默认[*]。当配置为*且NODE_ENVproduction时CORS 会被自动禁用corsOrigin返回false要求必须显式指定来源——这是为了生产安全UPGRADE_INSECURE_REQUESTS在 src/server.ts 读取为true时向自定义 CSP 指令中添加upgrade-insecure-requests默认通过删除 Helmet 默认值来保证该指令绝不出现X_FRAME_OPTIONS在 src/server.ts 读取为true时启用frameguard: { action: sameorigin }默认关闭以允许 iframe 嵌入。AI Assistant / LLM 配置变量必填默认值说明LLM_PROVIDER否openai使用的 AI 提供商openai或geminiOPENAI_API_KEY否-OpenAI API Keyprovider 专属GEMINI_API_KEY否-Google Gemini API Keyprovider 专属LLM_API_KEY否-通用 API Key两个 provider 均可使用LLM_NEIGHBORING_TOPICS_TOKEN_LIMIT否500AI 查询中相邻 Topic 上下文的 token 上限增大可提升设备关系识别能力架构与安全后端通过 WebSocket RPC 代理所有 LLM API 请求。API Key永远不会被发送到前端——前端只会收到一个可用性标志。前端通过 WebSocket RPCllm/chat事件调用后端由后端代客户端请求 OpenAI/Gemini。这一设计在 src/server.ts 的llmChatRPC 处理函数中有完整的实现证据✅ API Key 仅保留在服务端✅ Key 从不内嵌进前端打包产物✅ Key 从不传输到前端✅ 所有 LLM 访问由后端控制✅ 通信走安全的 WebSocket RPC。在io.on(connection)中服务端通过llm-available事件向前端广播 LLM 可用状态src/server.ts。注意如果未设置任何 LLM 环境变量AI Assistant 功能会完全对用户隐藏。带 AI Assistant 的完整启动示例docker run -d \ -p 3000:3000 \ -e MQTT_EXPLORER_USERNAMEadmin \ -e MQTT_EXPLORER_PASSWORDsecret \ -e LLM_PROVIDERopenai \ -e OPENAI_API_KEYsk-proj-xxxxxxxxxxxxxxxxxxxx \ -e LLM_NEIGHBORING_TOPICS_TOKEN_LIMIT500 \ ghcr.io/thomasnordquist/mqtt-explorer:latest关于 LLM 配置的更完整说明包括LLM_API_KEY作为通用回退、token 上限对上下文质量的影响、环境变量 localStorage 默认值的优先级顺序等可参考仓库中的 ENV_VARS_EXAMPLE.md。此外在 src/server.ts 中还可以看到一组MQTT_AUTO_CONNECT_*环境变量如MQTT_AUTO_CONNECT_HOST、MQTT_AUTO_CONNECT_PORT、MQTT_AUTO_CONNECT_USERNAME、MQTT_AUTO_CONNECT_CLIENT_ID它们用于在容器启动时自动连接指定 MQTT Broker 并订阅#通配主题适合无人值守的仪表盘场景。认证模式详解标准模式默认需要用户名和密码才能访问凭据可通过环境变量设置或自动生成自动生成的凭据会在首次启动时打印到日志并保存到/app/data/credentials.json。自动生成逻辑位于 src/AuthManager.ts用户名为user-前缀加 uuid 前 8 位如user-abc123密码为完整 uuid随后通过 bcrypt10 轮对密码哈希后写入credentials.json。认证校验则使用恒定时间比较用户名防时序攻击 bcrypt 比对密码src/AuthManager.ts。跳过认证模式慎用docker run -d -p 3000:3000 \ -e MQTT_EXPLORER_SKIP_AUTHtrue \ ghcr.io/thomasnordquist/mqtt-explorer:latest⚠️警告当MQTT_EXPLORER_SKIP_AUTHtrue时应用完全开放、没有任何认证。这只应在 MQTT Explorer 部署于安全认证代理如 OAuth2 Proxy、Authelia、带 auth_request 的 Nginx之后或位于受信任的私有网络时使用。推荐使用场景企业 SSO 系统集成——由反向代理负责认证。此时 AuthManager 的initialize()会打印醒目警告提示且服务端仍会对 WebSocket 连接标记authDisabled状态并下发auth-status事件src/server.ts。关于自动生成凭据的提示如果既未提供凭据也未跳过认证服务端会自动生成并存入/app/data/credentials.json。查看容器日志即可获得生成的凭据docker logs mqtt-explorer数据持久化容器将数据存储在/app/data目录包括用户凭据credentials.json连接设置settings.json上传的证书certificates/文件上传uploads/挂载卷以在容器重启后保留数据docker run -v mqtt-explorer-data:/app/data ...这些路径在源码中有多处印证凭据路径为data/credentials.jsonsrc/server.ts连接设置通过 backend/src/ConfigStorage.ts 读写data/settings.json证书与上传文件分别落在data/certificates/与data/uploads/src/server.ts 中的uploadCertificate、writeToFile、readFromFileRPC 处理器。Dockerfile.browser 在构建阶段也显式创建了/app/data目录并赋予运行用户写权限。从源码构建镜像多阶段构建解析Dockerfile.browser 采用两阶段构建值得展开说明阶段一builder基于node:22-alpine拷贝package.json、yarn.lock、tsconfig.json、src、backend、events、app全部源码yarn install --frozen-lockfile安装全部依赖含构建所需开发依赖执行yarn build:server——该脚本会先tsc编译 TypeScript再在app目录用 webpack.browser.config.mjs 以生产模式打包前端见根目录 package.json 的scripts重新执行yarn install --production剥离开发依赖并清理 yarn 缓存确保最终镜像最小化。阶段二production同样基于node:22-alpine安装dumb-init正确转发信号、处理僵尸进程创建 UID 1001 的mqttexplorer非 root 用户只拷贝编译产物dist编译后的 TypeScript 服务端、app/buildwebpack 前端产物、app/index.html、生产版node_modules与package.jsonUSER mqttexplorer切换非 root 运行EXPOSE 3000ENTRYPOINT为 dumb-init启动命令为node dist/src/server.js。这种编译产物 非 root 生产依赖的组合从镜像层面就落实了最小权限原则。健康检查容器内置健康检查每 30 秒执行一次通过HTTP GET http://localhost:3000判断服务是否正常200 即健康。相关配置见 Dockerfile.browser--interval30s --timeout10s --start-period40s --retries3。检查健康状态docker inspect --format{{.State.Health.Status}} mqtt-explorer输出healthy表示服务正常配合 docker-compose.yml 中的healthcheck定义容器编排系统如 Docker Compose、Swarm可以据此自动重启故障容器。生产环境安全最佳实践安全基线生产环境使用 HTTPS将容器置于带 HTTPS 的反向代理nginx、Traefik之后设置强凭据始终通过环境变量设置自定义凭据生产环境禁用自动生成的凭据网络隔离尽可能运行在私有网络定期更新定期拉取最新镜像获取安全更新。服务端安全机制的源码佐证浏览器模式服务端src/server.ts内置了多层安全防护可作为容器部署的默认保障helmet 安全头配置了 Content Security PolicyCSP、生产环境 HSTS一年有效期 includeSubDomains preload、X-Content-Type-Options: nosniff、X-Frame-Options、X-XSS-Protection等同时为了兼容 HTTP 直连场景默认关闭了跨域相关策略COEP/COOP/CORP认证限流express-rate-limit限制每个 IP 每 15 分钟最多 5 次认证尝试src/server.ts指数退避Socket.io 认证失败按 IP 记录并逐步拉长等待时间5 秒 → 10 秒 → 30 秒 → 60 秒 → 120 秒 → 300 秒 → 900 秒封顶见 src/server.ts文件上传防护16MB 大小上限MAX_FILE_SIZE、文件名净化sanitizeFilename剔除路径分隔符与空字节、拦截..目录穿越、realpath校验确保目标路径不逃逸数据目录src/server.ts密码哈希bcrypt 10 轮 用户名恒定时间比较src/AuthManager.ts生产不打印凭据NODE_ENVproduction时禁用凭据与控制台日志。示例Nginx 反向代理HTTPS WebSocketserver { listen 443 ssl http2; server_name mqtt-explorer.example.com; ssl_certificate /path/to/cert.pem; ssl_certificate_key /path/to/key.pem; location / { proxy_pass http://localhost:3000; proxy_http_version 1.1; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection upgrade; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header X-Forwarded-Proto $scheme; } }由于浏览器模式前端与后端之间依赖 Socket.io WebSocket 长连接Nginx 配置中必须包含Upgrade/Connection upgrade头转发否则订阅消息将无法实时推送。同样的要求也出现在 BROWSER_MODE.md 的生产部署章节中。在 HTTPS 代理之后建议同时设置UPGRADE_INSECURE_REQUESTStrue让 CSP 把所有内部 HTTP 资源请求升级为 HTTPS和ALLOWED_ORIGINS显式列出域名替换通配符*。故障排查容器无法启动检查日志docker logs mqtt-explorer无法访问应用确认容器在运行docker ps检查端口映射docker port mqtt-explorer测试连通性curl http://localhost:3000认证问题在日志中查看生成的凭据docker logs mqtt-explorer核对环境变量docker inspect mqtt-explorer删除数据卷后重启以重置凭据权限问题容器以非 root 用户UID 1001运行。如果挂载宿主机目录请确保目录可写chown -R 1001:1001 /path/to/host/data docker run -v /path/to/host/data:/app/data ...可用镜像标签latest— master 分支的最新稳定版master— master 分支最新构建beta— 最新 beta 版release— 最新发布版master-sha— master 的特定提交beta-sha— beta 的特定提交release-sha— release 的特定提交按提交号打标签的变体非常适合回滚场景当新版本出现问题时可用先前稳定提交的镜像快速恢复。支持的平台架构镜像为多架构构建linux/amd64— x86-64标准 PC、服务器linux/arm64— ARM 64 位Raspberry Pi 3/4/5、Apple Siliconlinux/arm/v7— ARM 32 位Raspberry Pi 2/3Docker 会根据宿主机平台自动拉取对应架构的镜像无需手动指定。一键部署选项除自建部署外DOCKER.md 还介绍了多种一键部署途径Play with Docker免费完全在浏览器中试用 MQTT Explorer无需安装任何东西仅需 Docker Hub 账号单次会话最长 4 小时到期自动回收非常适合快速演示与测试DigitalOcean App Platform自动识别 Docker 配置托管平台自带自动伸缩能力Koyeb直接基于 Docker 镜像部署依托全球边缘网络提供免费档位。注意无论部署到哪个云平台都记得通过环境变量设置MQTT_EXPLORER_USERNAME和MQTT_EXPLORER_PASSWORD避免使用自动生成的临时凭据。扩展阅读与许可浏览器模式的整体架构、Electron 与浏览器模式的差异、更多安全审计细节见 BROWSER_MODE.mdLLM/AI Assistant 环境变量的完整优先级与调优示例见 ENV_VARS_EXAMPLE.md浏览器模式服务端全部实现位于 src/server.ts认证模块位于 src/AuthManager.ts镜像构建定义见 Dockerfile.browser编排示例见 docker-compose.yml项目许可参见 LICENSE.md。赞分享开发工具物联网消息队列【免费下载链接】MQTT-ExplorerAn all-round MQTT client that provides a structured topic overview项目地址https://gitcode.com/gh_mirrors/mq/MQTT-Explorer点击查看免费下载相关推荐MQTT Explorer 浏览器模式Browser Mode完整指南Web 部署、认证体系与安全加固MQTT Explorer 浏览器模式Browser Mode完整指南Web 部署、认证体系与安全加固 MQTT Explorer 除了作为 Electr开发工具物联网消息队列NocoBase Docker Compose 安装部署指南从单机快速启动到生产环境加固NocoBase Docker Compose 安装部署指南从单机快速启动到生产环境加固 本篇技术指南围绕 NocoBase 的 Docker Compose低代码后端前端人工智能AI 应用工作流自动化MQTT Explorer 安全加固指南浏览器模式认证、输入防护与部署最佳实践MQTT Explorer 安全加固指南浏览器模式认证、输入防护与部署最佳实践 本篇技术指南以 MQTT Explorer 官方安全策略文档 SECURIT开发工具物联网消息队列上一篇RDCMan 远程桌面管理如何把多台服务器放进一个窗口下一篇30分钟搭好气象工作台MeteoInfo地图与Jython计算环境上手指南创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表