Javascript 如何使用toDataURL将图像从画布发送到php

我有这个密码

<form id="memeForm" method="post">
    {{ csrf_field() }}

</form>

由于我使用id为“img”的输入来存储图像数据，根据这篇文章，这不会是一个问题，因为输入最大值是521kb：

---

我注意到，在chrome中，从画布生成的图像的代码与Firefox中的不同。我可以用其他方式发送图像吗？

我认为没有其他方式可以发送从画布提取的图像。Chrome和Firefox有不同的代码，因为如果仔细观察就会发现画布渲染略有不同。他们不使用完全相同的算法进行渲染，因此微小的差异可能会导致像抗锯齿、抖动和类似的效果，这些效果有1或2位不同——足以生成完全不同的代码，因为JPG使用受每个像素影响的特定算法（颜色空间优化等）

字段限制的问题很容易避免。只需每隔512Kb拆分一次字符串，然后计算有多少片段，最后在表单中创建DOM节点：

var i, node, fragments;

// imagine "fragments" to be the array of the splitted dataURL
fragments = [ "gjwoituwe...", "4r1njhjfrqwf...", "e123jeiod..." ];

for (i = 0; i < fragments.length; i++)
{
  node = $("<input type='hidden' name='fragment_" + i + "'>").val(fragments[i]);
  $("#memeForm").appendChild(node);
}

现在，您可以将这些片段放在服务器上，以获得完整的dataURL

---

你应该删除静态的

#meme

字段，然后修复其余的代码。

谢谢，这是一个很好的建议，我自己不会想到的。

var i, node, fragments;

// imagine "fragments" to be the array of the splitted dataURL
fragments = [ "gjwoituwe...", "4r1njhjfrqwf...", "e123jeiod..." ];

for (i = 0; i < fragments.length; i++)
{
  node = $("<input type='hidden' name='fragment_" + i + "'>").val(fragments[i]);
  $("#memeForm").appendChild(node);
}

$_POST['fragment_0']
$_POST['fragment_1']
$_POST['fragment_2']
...