从HTML Canvas元素生成图像数据 [英] Generate image data from HTML Canvas element

问题描述

从HTML画布元素的内容生成图像数据的最佳方法是什么？

What is the best way to generate image data from the contents of an HTML canvas element?

我想创建图像数据，传输到服务器（用户不需要能够直接保存到文件）。图像数据应采用通用格式，例如PNG或JPEG。

I'd like to create the image data such that it can be transmitted to a server (it's not necessary for the user to be able to directly save to a file). The image data should be in a common format such as PNG or JPEG.

在多种浏览器中正常工作的解决方案是首选，但如果每个解决方案都取决于浏览器，则应定位Firefox的最新版本。

Solutions that work correctly in multiple browsers are preferred, but if every solution depends on the browser, recent versions of Firefox should be targeted.

推荐答案

我认为一个lib可以使用 Canvas2Image ，它使用Canvas的本机功能，但它不会在任何浏览器上工作。

I think a lib you can use is Canvas2Image, it uses native features from Canvas, but it won't work on any browser. I have an optimized version of this lib, if you want to, I'll share it with you.

然后你可以得到生成的数据URI ，并使用Ajax将其发送到服务器。

Then you could get the generated Data URI and send it using Ajax to the server.

这篇关于从HTML Canvas元素生成图像数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！