使用Firefox插件的Javascript捕获浏览器屏幕（完整且可见）

这个标题是不言自明的，但我将在这里进行更深入的解释。我的图像托管站点有一个Firefox扩展（目前已关闭）

它目前有两个特点：

• 右键单击图像并远程上载
• 右键点击图片，得到一个Javascript弹出窗口，输入新的宽度并上传

该扩展仍然需要一个（或两个）功能，允许用户上传浏览器上当前可见的内容或完整的浏览器捕获（包括滚动条下的内容）

我所尝试的： 我尝试过从其他扩展中复制不同的代码片段，并将它们与我自己的结合起来。它们包括了一些我并不真正理解的东西，比如

canvas

。我能够以某种方式得到一个base64图像字符串（我不记得是怎么得到的）。有了这个字符串，我认为实现目标的最佳方法是通过

XMLHttpRequest

将它发送到我的映像主机，并在主机中创建映像。

ResponseText

将是指向图像的链接

正如您所看到的，我在这里做的太多了-我显然不需要在服务器端对这个问题进行额外的处理。我认为有一些方法只处理扩展中的所有内容，而不需要在服务器端进行额外编码（如果我错了，请纠正我）

实际问题 这是附加组件：
正如您可以看到扩展添加的两个上下文菜单一样，我需要第三个上下文菜单，它的右侧有一个箭头，用于打开另一个包含我需要的两个新选项的菜单：

• 捕获可见屏幕并上传
• 捕获全屏并上传

第一个选项应该捕获并上传浏览器中可见的内容，不包括滚动条下的内容。第二个选项应该捕获所有内容并上传到我的网站，包括滚动条下的内容

添加上下文菜单不是什么大问题，但让它们按照我想要的方式运行是我的问题。我不知道如何开始，我在网络上的研究也不能让我走得更远。以某种方式通过Javascript创建图像（使用

canvas

，我不知道如何使用），并将base64编码的字符串发送到我的网站实际上可以工作，但拍摄快照并将其进行base64编码是个问题。我也不确定Firefox扩展是否真的允许我使用Ajax发送/接收数据

我需要你做什么 我需要一个合乎逻辑的方法来解决这个问题。如果您有想法，请回答并展示代码片段将不胜感激。我不是Javascript大师，但有了一些关于如何开始的信息，我就能摆脱这一困境

---

实现我想要的东西的最佳方法是什么？

查看devtools的屏幕截图命令的功能。

可能会有所帮助：我正在开发一个插件以获取本机屏幕截图，我已经完成了屏幕截图部分，正在使用画布编辑器，您是否可以合作？你在这方面有什么进展？这是我的工作：不是显示器，只是浏览器标签的内容？