Sketch iframes block pointer lock and file downloads (requestPointerLock and save* examples do nothing)

未关闭 适合新手
#1,639 1 条评论 0 个 reaction 已指派 1 人 在 GitHub 查看

维护者通常 1 天内回复

@Akshats-git 已经在做这个了。

开始于 2026年11月5日。

  • #1644 来自 @Akshats-git —— 未关闭

评估

难度
2/5
预计耗时
1-3 小时
新手友好度
62/100
Issue 类型
缺陷
描述清晰度
描述清楚
活跃度
活跃
技术栈
react, typescript
领域
frontend, security

调研方向

sandbox 属性在 src/components/CodeEmbed/frame.tsx 中设置,issue 指出该行是唯一需要的改动。请阅读该行,查看存在哪些 allow- 令牌,然后检查 issue 要求保持不变的 allow 属性。使用参考示例 requestPointerLock() 和 saveJSON() 进行复现。完成的标准是:指针锁定能够生效,下载在用户操作时开始,并且有测试覆盖 sandbox 的值。由于issue未说明安全方面的理由,在修改之前,请先向维护者询问当初为何省略这些标志。

由索引模型根据 Issue 内容生成。

描述

Most appropriate sections of the p5.js website?

Reference, Examples

What is your operating system?

Linux

Web browser and version

152.0.7977.64

I reproduced this in Chromium. The cause is the sandbox attribute on the iframe, which is in the HTML the site sends.

Actual Behavior

The iframe that runs sketches on the site has this sandbox in src/components/CodeEmbed/frame.tsx:

allow-scripts allow-popups allow-modals allow-forms allow-same-origin

It has no allow-pointer-lock and no allow-downloads. So two things fail silently:

  • requestPointerLock() is blocked. The browser logs "Blocked pointer lock". This is the problem in #789.
  • Downloads are blocked. The saveJSON() and saveStrings() examples on the reference pages download nothing. The Download button in the Loading and Saving Data examples (JSON and Table) does nothing too.
Expected Behavior

These examples should work the same as they do in the web editor. The pointer lock should engage, and the files should download when the user clicks or presses a key.

Steps to reproduce
  1. Open the requestPointerLock() reference page, double click the sketch, and check the console.
  2. Open the saveJSON() reference page, double click the sketch, and check for a download.
  3. Open the Examples page for Loading and Saving Data, then JSON, and click the Download button.

On a local build I added allow-pointer-lock allow-downloads to the sandbox. The pointer lock then worked, and numbers.json and data.txt downloaded.

I checked the reference examples that call save functions. They run on a key press, a double click or a button, so none of them should start a download on page load.

The fix is small. I would change only the sandbox line and add a test for it. I did not touch the allow attribute, so this does not overlap with #1583.

Related: #789

Would you like to work on the issue?

Yes, I would like to work on it. Is there any reason these flags were left out on purpose?

主要语言
MDX
星标
97
派生
330
平均合并
2 天 6 小时
30 天内合并 PR
14

环境准备

这个项目没有提供开发容器、Dockerfile 或贡献指南,环境需要你自己搭建:先看它的 README,通用步骤见我们的新手贡献指南。

从这里开始

  1. 先读完整个 Issue,再读项目的贡献指南。
  2. 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
  3. Fork 仓库,在一个分支上完成修改。
  4. 提交 Pull Request,并在描述里引用这个 Issue 编号。

processing/p5.js-website 的其他 Issue

查看 processing/p5.js-website 的全部 Issue

相似的 Issue

更多 Web Dev Issue

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。