ARTICLE DETAIL

资讯详情

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

RuView 三维点云查看器上云:GitHub Pages 静态托管 + 本地实时数据回连(ADR-094)方案全解析

RuView 三维点云查看器上云:GitHub Pages 静态托管 + 本地实时数据回连(ADR-094)方案全解析 RuView 三维点云查看器上云GitHub Pages 静态托管 本地实时数据回连ADR-094方案全解析【免费下载链接】RuViewπ RuView turns commodity WiFi signals into real-time spatial intelligence, vital sign monitoring, and presence detection — all without a single pixel of video.项目地址: https://gitcode.com/GitHub_Trending/wi/RuView本篇基于仓库 docs/adr/ADR-094-pointcloud-github-pages-deployment.md 展开围绕其架构决策梳理「单一 HTML 查看器如何在纯静态 GitHub Pages 上运行又能通过 URL 参数回流本地 ESP32 WiFi CSI 实时点云」的完整技术路线。读者读完可以掌握四种传输模式的设计取舍、/api/splatsJSON 数据契约、CORS 来源白名单实现以及对应 CI 部署与验收标准。文中所有实现结论均有仓库源码佐证。RuView 的wifi-densepose-pointcloudcrate 把「相机深度 WiFi CSI mmWave」融合成实时的稠密三维点云并在浏览器里以 Three.js 场景呈现。但早期这套查看器只活在本地由 RustAxum二进制在回环地址上托管页面从同源/api/splats拉数据。这带来一个体验不对称——访客打开首页就能一键体验 WiFi 姿态与 Observatory 的 hosted demo却看不到 v0.7 传感器融合最具视觉冲击力的点云演示除非自己克隆仓库、编译 Rust、接上 ESP32 并对着摄像头。ADR-094 正是为了解决这个缺口而提出的部署与双传输demo/实时方案。1. 背景Local-only 查看器的体验缺口与两个「天真修法」1.1 现状盘点ADR 记录的初始状态原文 Context 部分包含四个关键事实均可在仓库中印证事实仓库证据查看器是随 Rust 二进制一起分发的单文件 HTML查看器源码为 v2/crates/wifi-densepose-pointcloud/src/viewer.htmlcrate 描述为 Real-time dense point cloud from camera depth WiFi CSI tomography见 v2/crates/wifi-densepose-pointcloud/Cargo.tomlAxum 服务器默认绑定127.0.0.1:9880CLI 定义见 v2/crates/wifi-densepose-pointcloud/src/main.rs#L41-L49--bind默认127.0.0.1:9880前端轮询同源/api/splatsv2/crates/wifi-densepose-pointcloud/src/stream.rs 中路由/api/splats每帧输出最新高斯泼溅Gaussian splatsviewer 的 URL 参数注释见 viewer.html 中?backend相关行无 Pages 托管README 的 Live 演示链接指向 moved-content 章节README.md#L193 的▶ Live 3D Point Cloud链接已指向 Pages 演示路径早期版本链接到 docs/readme-details.md同期同仓库另外两个演示Live Observatory、Dual-Modal Pose Fusion已经走 GitHub Pages 托管路线于是产生了「一键可预览 WiFi 姿态演示却无法预览点云」的不对称。1.2 两个被否决的「天真修法」ADR 原文明确排除了两种直觉方案直接丢一个静态 HTML 到 Pagesviewer 里的fetch(/api/splats)在 Pages 上必然 404Canvas 永远停在 Loading…不能工作。把一份固定样本数据集烤进 HTML虽然解决了加载态但彻底丢掉了「实时数据」这个核心叙事还把查看器分叉成「演示 build」和「真实 build」两个会逐渐漂移的版本。这构成 ADR 的判定基线绝不允许两个 build 分叉——只能是一个文件、一条渲染路径、同一套 bug。2. 决策单文件 viewer URL 参数驱动的四种传输模式核心决策一句话概括只发布一个 viewer由 URL 查询参数自动选择传输层并部署到 Pages 的pointcloud/目录。下面按 ADR 原文整理四种模式并对照仓库中 viewer.html 的真实实现。2.1 默认模式MediaPipe Face Mesh 浏览器内点云当无任何查询参数打开 Pages 演示时仓库 viewer 中backendArg缺省为auto但无同源后端时会静默落到合成 demo见 viewer.html 中backendArg urlParams.get(backend) || auto页面呈现一个Enable camera CTA实现中按钮文案为▶ Project Subject — render your face into the Vault点击后请求摄像头权限浏览器内运行MediaPipe Face Mesh约 30 fps、478 个精细化关键点把访客自己的脸渲染成点云——这是本地「深度反投影面部几何」在浏览器里最接近的等价物呼应了催生本文档的那句原话I could see the outline of my face in points渲染做x 镜像以符合自拍惯例并把 Face Mesh 的相对 z 映射到与实时/api/splats载荷相同的世界坐标范围从而单一渲染路径同时驱动 demo 与 live模式角标为● DEMO Your Face (MediaPipe)viewer 源码中对应.face样式分支用户拒绝授权、关掉提示或设备没有摄像头时自动回退到程序化脚手架场景地面网格、墙体、呼吸人体与 17 关键点骨架全部处理发生在客户端视频帧绝不出浏览器预计 splat 规模为脸部约 480–500 个 splat 约 110 个地面/墙体上下文 splat。值得补充的实现细节仓库 viewer 对 Face Mesh 还做了稠密化——不仅按 478 个顶点投点还沿FACEMESH_TESSELATION网格边插值代码注释 6 splats per edge使脸部点云远超顶点数视觉上更接近本地相机深度反投影的密度。同时当摄像头开启且处于 live/remote 模式时浏览器人脸点云可以叠加在真实后端 splat 之上viewer 中handleData检测到latestFaceLandmarks时的 overlay 分支这在 ADR 里被视为默认 demo 的附加能力。2.2 Auto 模式?backendauto从同源/api/splats拉数据——即本地开发场景ruview-pointcloud serve把 viewer 与 API 一起托管。任何失败404、网络错误、CORS都静默回退到合成 demo 渲染保证页面标签页永不死。2.3 Remote 模式?backendurl从url/api/splats拉数据这是集成 ESP32 的路径用户本地运行ruview-pointcloud serve --bind 127.0.0.1:9880ESP32-S3 通过 UDP 3333 端口把 CSI 送进融合管线打开?backendhttp://127.0.0.1:9880hosted Pages viewer 就变成本地 Rust 融合管线camera depth WiFi CSI mmWave的薄客户端无需 clone、无需重新编译viewer 提供 Connect ESP32…按钮源码中#esp-cta提示输入 URL持久化到localStorage后带查询参数重载。仓库 viewer 的实际 URL 参数解析注释与 ADR 相比还多定义了一个取值四态齐备?backendurl → fetch splats from url/api/splats需要目标允许 CORS ?backendauto → 尝试 /api/splats失败则回退合成 demo默认 ?backenddemo → 永远渲染合成 demo不做任何网络请求 ?live1 → 要求实时失败显示错误而非 demo 回退因此实现层面真实存在五个有效状态auto无参默认、demo、url远程、live1严格实时以及相机开启时的 Face Mesh 叠加层。合成 demo 回退时模式角标为● DEMO Syntheticviewer 中.demo分支。2.4 Strict-live 模式?live1禁用 demo 回退。若所选传输失败信息面板被替换为显式离线文案● OFFLINE — Live backend required but unreachable适合把 viewer 嵌入状态页或信息亭kiosk。viewer 源码在回退处先检查live1才决定是否渲染离线面板。2.5 合成帧与实时载荷的 JSON 契约完全一致ADR 强调浏览器内合成帧生成器输出的 JSON 形状必须与实时/api/splats载荷逐一对应字段说明splats高斯泼溅数组live 模式下由pointcloud.rs序列化countsplat 数量frame帧序号viewer 以它判重、计算帧率live是否实时来源pipeline管线信息对象skeleton、vitals等在 viewer.html 的合成帧构造中可看到这组字段被原样写出handleData → updateSplats → drawSkeleton这条唯一渲染管线对 demo 与 live 一视同仁视觉回归会在两种模式中同时暴露。3. Remote 模式能工作的前提CORS 来源白名单源码级HTTPS 的 Pages 页面要 fetch 纯 HTTP 回环地址需要两层放行浏览器把127.0.0.1/localhost视为potentially trustworthyChrome 94、Firefox 116、Safari 16.4所以不存在 mixed-content 拦截以及本地服务器要回答 CORS 预检。仓库 v2/crates/wifi-densepose-pointcloud/src/stream.rs 中serve()安装了一个tower_http的CorsLayer用AllowOrigin::predicate精确放行三类来源不是通配 CORShttps://ruvnet.github.io —— 已发布的 Pages 演示 http://localhost:* —— 开发者直接打开随包 viewer.html http://127.0.0.1:* —— 同上回环 null —— file:// 来源CORS 层同时限定GET/OPTIONS方法与Content-Type请求头。任何其它来源如公网主机名一律拒绝。serve()在启动时还会打印防护提示绑定到0.0.0.0会把 camera/CSI/vitals 暴露到网络必须显式用--bind 127.0.0.1:9880收敛到回环main.rs 的 Serve 命令注释同样写明该安全默认值。服务端路由与载荷结构stream.rs路由作用/返回内置viewer.html/api/cloud返回点云摘要points数量、bounds_min/max、前 1000 个点等/api/splats返回高斯泼溅帧splats、count、live、frame、pipeline、timestamp/api/status运行状态/health存活探针单个 splat 的 Rust 结构v2/crates/wifi-densepose-pointcloud/src/pointcloud.rs为GaussianSplat { center: [f32;3], color: [f32;3], opacity: f32, scale: [f32;3] }这与 viewer 渲染器消费的splats数组字段一一对应——这正是「合成帧能走同一条渲染路径」的底层原因。4. CI 部署GitHub Actions 推送即发布ADR 规划的部署工作流是.github/workflows/pointcloud-pages.yml而该文件在当前仓库中已存在触发条件每次push到main且改动触及 viewer 文件另支持workflow_dispatch手动触发动作把 viewer 复制暂存为_site/pointcloud/index.html再经peaceiris/actions-gh-pagesv4部署到gh-pages/pointcloud/关键参数keep_files: true保留既有 observatory、pose-fusion 与 nvsim 部署避免互相覆盖。ADR 特别指出这是与 ADR-092 nvsim dashboard 相同的双传输模式demo/实时由同一份代码承载详见 docs/adr/ADR-092-nvsim-dashboard-implementation.md。5. 影响评估5.1 正面影响一击即达的 demo访客点击 README 的▶ Live 3D Point CloudREADME.md#L193进入可用 Three.js 场景1 s 出画面无需任何工具链与前两个 hosted demo 对齐。按需接入真实数据自备ruview-pointcloud serve主机的用户可复用同一个 hosted viewer URL 并追加?backendurl——hosted demo 同时充当自托管后端的薄客户端无需 clone/rebuild。单一路径合成帧与实时帧走同一条handleData → updateSplats → drawSkeleton管线demo 与 live 同步暴露视觉回归。无需部署后端Pages 只托管静态 HTML不需要在公网起 Axum 主机也没有按访客预置 CSI/相机管线的开销。不破坏既有部署keep_files: truepointcloud/目标目录使 observatory/、pose-fusion/、nvsim/ 与 gh-pages 根 index 均不受影响。5.2 负面 / 权衡Face Mesh ≠ CSI浏览器摄像头 MediaPipe 提供真实面部几何但不是 CSI 推算的位姿想验证 WiFi 驱动路径仍需?backendhost。程序化回退同样非 WiFi 驱动纯粹是视觉脚手架。ADR 明确接受这一取舍——hosted demo 的目标是传达本地管线输出用户的点云形状而不是在浏览器里复刻 WiFi 物理后者留给未来 ADR融合 crate 的 WASM 移植。Remote 模式背负 CORS 义务想分享后端的人需在自建服务上加入对 Pages demo 来源的Access-Control-Allow-OriginADR 将这一点写进 workflow 生成的 README并明确不提供公共 CORS 代理。合成生成器住在 viewer 里约 80 行程序化 JS 成为viewer.html的一部分。可接受——该文件本就是客户端渲染 bundle且生成器有界且惰性确定性、无 I/O、无 eval。实现层面 viewer 的合成脚手架由pushFoundationContext地板/墙体/呼吸体/骨架构成。本文档不含录制回放未来可能的?recordingurl.jsonl回放模式明确不在本文档范围内。5.3 中性影响本地开发体验不变ruview-pointcloud serve依旧从内嵌 asset 提供viewer.htmlviewer 因?backend缺省为auto依旧请求/api/splats。Rust crate 零改动——本文档方案 HTML workflow 而已当前仓库在 ADR 之外viewer 本身已迭代出0.2.0-face-mesh版本见其meta nameruview-viewer-version属实现侧自然的演化。6. 实现改动清单与验收标准6.1 文件改动表ADR §4文件改动v2/crates/wifi-densepose-pointcloud/src/viewer.html增加 URL 参数传输选择器backend、live、合成帧生成器、demo 回退路径、模式角标约 120 行、无行为删除.github/workflows/pointcloud-pages.yml新 workflow暂存到_site/pointcloud/index.htmlkeep_files: true部署到gh-pages/pointcloud/viewer 变更 手动触发README.md▶ Live 3D Point Cloud链接在首次部署成功后改指 Pages 演示路径README.md#L193 已更新独立跟踪、不阻塞本文档docs/adr/README.mdADR 索引补 ADR-094 行6.2 六项验收门Acceptance GatesADR 定义的已实现Implemented判据如下可作为运维回归清单向main推送带 viewer 改动的 commit 触发pointcloud-pages.yml并在60 秒内部署到gh-pages/pointcloud/Pages 的/pointcloud/加载并呈现 CTA授权后把访客的脸渲染成点云角标● DEMO Your Face (MediaPipe)且 splat/frame 计数非零拒绝授权则回退程序化场景、角标● DEMO Synthetic首次部署后既有演示根路径、pose-fusion.html、nvsim/仍然可达人工冒烟?live1显示● OFFLINE面板Pages 上不存在同源后端?backendhttps://example.invalid在一个轮询周期约 500 ms内回退到 demo控制台不抛错本地./target/release/ruview-pointcloud serve后打开http://127.0.0.1:9880/仍以 live 模式渲染角标● LIVE Local Backend。对照当前仓库ADR-094 在文档层面状态为Proposed (2026-04-29)但源码侧已出现实现证据——viewer.html 具备全部传输模式与角标分支、.github/workflows/pointcloud-pages.yml已落盘、README 的演示链接已指向 Pages 路径。阅读时建议以仓库当前代码为准将 ADR 视作方案的契约与验收依据。7. 明确不在范围内的事项在浏览器回放录制的 JSONL 帧留待未来 ADR在浏览器以 WASM 执行融合管线需要移植 camera mmWave 路径已推迟鉴权 / 签名 splat 载荷——属于后端关注点不受此纯客户端改动影响为没有自建后端的用户托管公共 CORS 代理。8. 继续深入阅读决策索引docs/adr/ADR-092-nvsim-dashboard-implementation.md同一双传输模式先例、docs/adr/ADR-059-live-esp32-csi-pipeline.mdESP32 实时 CSI 管线、docs/adr/ADR-079-camera-ground-truth-training.md相机真值训练实现源码viewer.html单文件查看器与四种传输、stream.rsAxum 服务、CORS 白名单、/api/splats、pointcloud.rsGaussianSplat数据契约、main.rsCLI 子命令serve/capture/demo/cameras/train/csi-test/fingerprint部署.github/workflows/pointcloud-pages.yml仓库总览README.md 的▶ Live 3D Point Cloud入口与docs/readme-details.md一句话收束ADR-094 的范式是「一个 viewer、一条渲染路径、URL 参数切传输」——它用最小改动把本地专属的实时点云演示搬上纯静态 Pages同时保留真实 WiFi/ESP32 数据回连的能力是 RuView v0.7 传感器融合工作在公开演示层面与既有 hosted demo 对齐的关键一步。【免费下载链接】RuViewπ RuView turns commodity WiFi signals into real-time spatial intelligence, vital sign monitoring, and presence detection — all without a single pixel of video.项目地址: https://gitcode.com/GitHub_Trending/wi/RuView创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表