是否可以捕获或打印html画布中显示的图像或pdf?
我想通过画布生成一个图像,并能够从该图像生成一个png.
我一直在尝试重新实现像Mozilla Hacks网站上的 HTML5图像上传器,但它适用于WebKit浏览器.部分任务是从canvas对象中提取图像文件并将其附加到FormData对象以进行上载.
问题是虽然canvas具有toDataURL返回图像文件表示的函数,但FormData对象仅接受来自File API的 File或Blob对象.
Mozilla解决方案使用以下仅限Firefox的功能canvas:
var file = canvas.mozGetAsFile("foo.png");
Run Code Online (Sandbox Code Playgroud)
...在WebKit浏览器上不可用.我能想到的最好的解决方案是找到一种方法将数据URI转换为File对象,我认为它可能是File API的一部分,但我不能为我的生活找到一些东西.
可能吗?如果没有,任何替代方案?
谢谢.
我正在整理 HTML+JS 代码以在自动将表单提交到服务器之前调整图片大小。我最初编写了用于自动提交表单的代码,然后添加了用于调整图像大小的逻辑。自动表单提交有效,但图像大小调整无效。请提供指导。先感谢您。
<!DOCTYPE html>
<html>
<head>
<title>Flask App</title>
<meta name="viewport" content="width=device-width, initial-scale=1, user-
scalable=no">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"></script>
<script src="http://malsup.github.com/jquery.form.js"></script>
<script type="text/javascript">
$(function(){
//JS Code snippet 1 - Automatic form submission on file selection
$("#file_select").change(function(){
$("#upload_form").submit();
$("#upload_form_div").hide();
$("#loading").show();
//JS Code snippet 2 - Image Resizing
var filesToUpload = inputs.files;
var img = document.createElement("img");
var reader = new FileReader();
reader.onload = function(e) {img.src = e.target.result}
reader.readAsDataURL(file);
var ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0);
var MAX_WIDTH = 800;
var MAX_HEIGHT = 600;
var …Run Code Online (Sandbox Code Playgroud)