Hacktoberfest 2026: những issue maintainer đã đánh dấu cho tháng Mười, đang mở và phù hợp người mới. Xem issue Hacktoberfest

Self-hosted dashboard stays blank in Chrome: CSP script-src 'self' blocks WebAssembly compilation (v0.3.0)

Đang mở Phù hợp với người mới
  • Có gì không ổn?
#1,921 0 bình luận 0 reaction 0 người được giao Xem trên GitHub

Maintainer thường phản hồi trong vòng 1 ngày

Chưa có ai nhận issue này.

Đánh giá

Độ khó
2/5
Thời gian dự kiến
1-3 giờ
Mức phù hợp với người mới
78/100
Loại issue
Lỗi
Độ rõ ràng
Đặc tả rõ ràng
Mức độ hoạt động
Sôi nổi
Công nghệ
typescript
Lĩnh vực
frontend, security

Hướng nghiên cứu

Đọc apps/cli/src/server/serve.ts và apps/local-ui/src/worker-entry.ts, nơi issue xác định các định nghĩa CSP cần cập nhật. Kiểm tra quá trình khởi động dashboard trong Chrome và xác nhận CSP riêng của trang đăng nhập vẫn không thay đổi. Công việc hoàn tất khi WebAssembly biên dịch thành công và dashboard tải mà không có lỗi CSP đã nêu.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Mô tả

Summary

The self-hosted image (ghcr.io/mapletechlabs/maple:v0.3.0) serves the dashboard with Content-Security-Policy: ... script-src 'self' ..., but the UI compiles a WebAssembly module at start-up. Chrome blocks it, the app never initialises and the page stays blank (dark background, empty <div id="app">) after signing in. No error is shown to the user.

Environment

  • Image ghcr.io/mapletechlabs/maple:v0.3.0 (linux/amd64), default entrypoint (start --offline), behind an HTTPS reverse proxy (ingress-nginx) with MAPLE_LOCAL_INGEST_KEY / MAPLE_LOCAL_ACCESS_TOKEN set.
  • Chrome 156 on Linux (also reproduced with headless Chrome driven by Puppeteer).

Steps to reproduce

  1. Run the self-hosted image and open the dashboard through an HTTPS origin.
  2. Sign in with the access token.
  3. The page stays blank.

What I observed

  • GET /, /theme-init.js, /assets/index-*.js, /assets/index-*.css and the font all return 200.
  • The browser then sends no request to /local/status or /local/query: the app crashes before its first API call.
  • Console / pageerror:
CompileError: WebAssembly.Module(): Compiling or instantiating WebAssembly module violates the following
Content Security policy directive because 'unsafe-eval' is not an allowed source of script in the following
Content Security Policy directive: "script-src 'self'".
    at <anonymous> (/assets/index-DfUivVRN.js:145:261244)
  • Response header sent by the binary:
content-security-policy: default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'; img-src 'self' data:; font-src 'self' data:; connect-src 'self' http://127.0.0.1:* http://localhost:*; object-src 'none'; base-uri 'none'; form-action 'none'; frame-ancestors 'none'

Cause and suggested fix

UI_CONTENT_SECURITY_POLICY in apps/cli/src/server/serve.ts (and CONTENT_SECURITY_POLICY in apps/local-ui/src/worker-entry.ts, which it mirrors) has script-src 'self' without 'wasm-unsafe-eval'. Chrome requires 'wasm-unsafe-eval' (or 'unsafe-eval') to compile WebAssembly under a CSP. Both files on main (f676476) still lack it.

Adding 'wasm-unsafe-eval' to script-src should be enough; it only allows WebAssembly compilation and does not enable JavaScript eval.

Workaround

Rewrite the header at the reverse proxy, adding only 'wasm-unsafe-eval' to script-src. After doing that the app starts and queries the API normally (verified with headless Chrome: sign-in, then /local/status and /local/query return 200 and the dashboard renders). The sign-in page uses its own, stricter CSP (form-action 'self') and should be left as is.

Not tested

I did not test maple start --offline on loopback or other browsers, so I cannot say whether the problem also appears there.

Ngôn ngữ chính
TypeScript
Star
1.8k
Fork
120
Merge trung bình
8 giờ 11 phút
Pull request đã merge (30 ngày)
667

Chuẩn bị môi trường

Dự án này không cung cấp dev container, Dockerfile hay hướng dẫn đóng góp, nên bạn cần tự thiết lập môi trường: hãy bắt đầu từ README và xem hướng dẫn đóng góp lần đầu của chúng tôi để biết các bước chung.

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Issue khác của MapleTechLabs/maple

Tất cả issue của MapleTechLabs/maple

Issue tương tự

Thêm issue về TypeScript

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.