将所选区域作为图像上传到服务器

Question

我想创建一个应用程序（Firefox扩展程序），它将获取一个屏幕区域，另存为图像并上传到服务器。

这是我的路线图：

首先，我将创建一个适用于所有域的 greasemonkey 用户脚本。 当任何页面加载时，它将添加一个名为screengrab + upload的小按钮。 当用户单击该按钮时，它将添加一个鼠标处理程序，以便我可以绘制div元素。

通过这个可调整大小的div元素，我将在网页上选择一个矩形区域。在MouseUp事件中，我将在所选区域上添加等效的Canvas元素。

然后我将使用todataurl函数将所选区域转换为图像/ png。现在，我想将此数据上传到我的服务器。因为我的服务器与网页的域不同，所以我需要通过跨域脚本将数据（image / png base64 encoded）上传到服务器。

对于图片上传，我会将隐藏的iframe从我的域名添加到网页。在网页上，数据将作为变量发布到此iframe，然后从iframe将数据发布到我的服务器。

最后，我将使用编译器/转换器将 greasemonkey 脚本转换为FireFox扩展。

我能用这种方式制作这个应用程序吗？ 请建议正确的方法。

Answer 1

是的，你可以做到这一点。写下你的GM脚本（我建议including jQuery使其更容易）。如果您使用GM，请使用User Script Compiler进行扩展。