我有一些客户端JavaScript，如果用户执行单击“确定”按钮等操作，将输出基于HTML5 canvas操作的jpeg文件。
我希望将jpeg输出自动加载到表单中的“Upload Front Side”字段中，就像用户从他或她自己的硬盘驱动器上传文件一样。
然而，我似乎无法让它发挥作用。
以下是表格：
<div class="property-wrapper">
<label for="upload-front">Upload Front Side</label>
<input id="upload" class="file" type="file" enctype="multipart/form-data" id="Front-Side" name="properties[Front Side]" onchange="readURL(this);" accept="image/*" />
</div>
<script>
document.getElementById('upload').value="http://upload.wikimedia.org/wikipedia/commons/thumb/2/22/Turkish_Van_Cat.jpg/353px-Turkish_Van_Cat.jpg"
</script>
答案 0 :(得分：5)
问题是，由于安全原因，浏览器对以文件上传编程方式可以执行的操作有几个限制，请查看此answer。
文件上传功能可能被利用，例如，如果使用display：none隐藏文件上传输入字段，某些浏览器将不会打开资源管理器框。
大多数浏览器不允许对文件上传元素进行编程点击，并要求用户改为点击它们，以防止有人向页面发送链接的攻击，该链接会立即窃取用户硬盘中的内容。
因此，由于常见的浏览器安全限制，您提及的功能似乎不可行。通常没有错误消息或警告，它只是不起作用。
使用文件上传浏览器输入组件的替代方法可以是在Base64中对文件的内容进行编码，并在例如ajax POST的主体中发送。
答案 1 :(得分：0)
您是否在询问如何通过表单将从网页画布中提取的图形图像上传到服务器？这将是有用的，我希望看到这个答案。
我首先要让用户下载/导出图像。这可能是用blob完成的。我已经为文本数据导出做了这个，效果很好。
也许有一种方法可以应用相同的技巧，只需将blob /缓冲区提供给服务器。
另一条路径可能是在服务器“PUT”文件。
希望这有帮助。
答案 2 :(得分：0)
我会在POST上写一个base64编码的图像字符串并忘记整个文件上传内容。您可以直接上传画布代码并在需要预览时查看服务器端，或者查看画布/图像转换器代码中可用的其他输出。
我假设您上传到同一台服务器，因此您不会遇到跨域问题，但您可以设置服务器以便轻松接受跨域ajax请求。