- r - 以节省内存的方式增长 data.frame
- ruby-on-rails - ruby/ruby on rails 内存泄漏检测
- android - 无法解析导入android.support.v7.app
- UNIX 域套接字与共享内存(映射文件)
有没有办法将 HTML Canvas 的内容读取为二进制数据?
目前我有以下 HTML 来显示输入文件和它下面的 Canvas :
<p><button id="myButton" type="button">Get Image Content</button></p>
<p>Input:<input id="fileInput" type="file"/></p>
<p>Canvas<canvas id="myCanvas" width="578" height="200"/></p>
然后我设置了我的输入文件以正确设置 Canvas ,效果很好:
$('#fileInput').on('change', function() {
$.each(this.files, function() {
var image = new Image();
image.src = window.URL.createObjectURL(this);
image.onload = function() {
$("canvas").drawImage({
source: image,
x: 50, y: 50,
width: 100,
fromCenter: false
});
};
});
});
我现在需要在单击按钮时从 Canvas 获取二进制数据(Base64 编码),以便将数据推送到服务器...
最终结果是我需要为用户提供选择文件、裁剪/调整大小,然后单击一个按钮,此时编辑后的图像将上传到服务器(我做不到由于服务器端限制,服务器端裁剪/调整大小...)
任何帮助都会很棒!干杯
最佳答案
canvas
元素提供了一个 toDataURL
方法,该方法返回一个 data:
URL,其中包含给定格式的 base64 编码图像数据。例如:
var jpegUrl = canvas.toDataURL("image/jpeg");
var pngUrl = canvas.toDataURL(); // PNG is the default
虽然返回值只是 base64 编码的二进制数据,但 trim 方案和文件类型以获取您想要的数据是一件简单的事情。
如果浏览器认为您已将从不同来源加载的任何数据绘制到 Canvas ,则 toDataURL
方法将失败,因此此方法仅在您的图像文件是从与其脚本执行此操作的 HTML 页面相同的服务器。
有关详细信息,请参阅 the MDN docs on the canvas
API ,其中包括有关 toDataURL
和 the Wikipedia article on the data:
URI scheme 的详细信息,其中包含有关您将从该调用中收到的 URI 格式的详细信息。
关于javascript - 从 HTML5 Canvas (readAsBinaryString) 获取二进制 (base64) 数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15685698/
如果我不定义自己的构造函数,Base *b = new Base; 与 Base *b = new Base(); 之间有什么区别吗? 最佳答案 初始化是标准中要遵循的一种 PITA...然而,这两个
是否有现成的函数可以在 C# 中进行基本转换?我希望将以 26 为基数和以 27 为基数的数字转换为以 10 为基数。我可以在纸上完成,但我不是一个非常有经验的程序员,如果可能的话,我宁愿不要从头开始
JNA 中'base'是什么意思 Pointer.getPointerArray(long base) Pointer.getStringArray(long base) ? JNA Document
我正在做一个将数字从 10 进制转换为 2 进制的基本程序。我得到了这段代码: #include #include #include #include using namespace std;
“假设以下代码: public class MultiplasHerancas { static GrandFather grandFather = new GrandFather();
当我分析算法的时候,我突然问自己这个问题,如果我们有三元计算机时间复杂度会更便宜吗?还是有任何基础可以让我们构建计算机,这样时间复杂度分析就无关紧要了?我在互联网上找不到太多,但是基于三元的计算机在给
一个简化的场景。三个类,GrandParent,Parent 和 Child。我想要做的是利用 GrandParent 和 Parent 构造函数来初始化一个 Child 实例。 class Gran
我编写了一个简单的函数来将基数为 10 的数字转换为二进制数。我编写的函数是我使用我所知道的简单工具的最佳尝试。我已经在这个网站上查找了如何执行此操作的其他方法,但我还不太了解它。我确定我编写的函数非
我尝试了以下代码将数字从 base-10 转换为另一个 base。如果目标基地中没有零(0),它就会工作。检查 79 和 3 并正确打印正确的 2221。现在尝试数字 19 和 3,结果将是 21 而
这个问题在这里已经有了答案: Is Big O(logn) log base e? (7 个答案) 关闭 8 年前。 Intro 练习 4.4.6 的大多数解决方案。算法第三版说,n*log3(n)
如何判断基类(B)的指针是否(多态)重写了基类的某个虚函数? class B{ public: int aField=0; virtual void f(){}; }; class C
我测试了这样的代码: class A { public A() { } public virtual void Test () { Console.WriteL
两者都采用相同的概念:定义一些行和列并将内容添加到特定位置。但是 Grid 是最常见的 WPF 布局容器,而 html 中基于表格的布局是 very controversial .那么,为什么 WPF
我试图在 JS 中“获得”继承。我刚刚发现了一种基本上可以将所有属性从一个对象复制到另一个对象的简洁方法: function Person(name){ this.name="Mr or Miss
class A { public override int GetHashCode() { return 1; } } class B : A { pu
我有一个 Base32 信息哈希。例如IXE2K3JMCPUZWTW3YQZZOIB5XD6KZIEQ ,我需要将其转换为base16。 我怎样才能用 PHP 做到这一点? 我的代码如下所示: $ha
我已经使用其实验界面对 Google Analytics 进行了一些实验,一切似乎都运行良好,但我无法找到 Google Analytics 属性如何达到变体目标的答案,即归因 session - 基
if (state is NoteInitial || state is NewNote) return ListView.builder(
MSVC、Clang 和 GCC 不同意此代码: struct Base { int x; }; struct Der1 : public Base {}; struct Der2 : public
我已经尝试构建一个 Base 10 到 Base 2 转换器... var baseTen = window.prompt("Put a number from Base 10 to conver
我是一名优秀的程序员,十分优秀!