向服务器发送大 canvas 数据

Send large canvas data to server

我曾尝试将 canvas 数据作为图像发送,但是当图像很大时,它不会发送数据,所以我尝试作为表单数据发送,但我无法接收代码。代码隐藏接收 html 输入元素对象。我怎样才能收到它?有人可以帮忙吗

Html:

var data = canvas.toDataURL("image/png");
    data = data.substr(data.indexOf(',') + 1).toString();
var dataInput = document.createElement("input");
    dataInput.setAttribute("name", "imgdata");
    dataInput.setAttribute("value", data);
    dataInput.setAttribute("type", "hidden");
var myForm = document.createElement("form");
    myForm.appendChild(dataInput);

Ajax:

$.ajax({
    url: "HTML5Camera.aspx/Upload",
    type: "POST",
    // data : $('form').serialize(),
    data: "{ 'image': '" + data1 + "'}",
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function (data, status) {
        alert('success')
    }
});

代码隐藏:

[WebMethod(EnableSession = true)]
    public static string Upload(string image)    

    {

    }

尝试调整 web.config 中的请求限制:

<system.web>
    ...
    <httpRuntime maxRequestLength="8192" ... />

这里以 8 mb 为例(... 表示您可能在 file/tag 中拥有的其他信息)。所有 base-64 编码文件的大小都增加了 33%,设置最大限制时需要考虑这一点。

(当您将示例复制到 post 时,可能是一个错误,但 data1 未在任何地方定义,参考 ajax 方法)。

为了完整性更新(来自评论):

<system.web.extensions> 
  <scripting> 
    <webServices> 
      <jsonSerialization maxJsonLength="2147483647"/> 
    </webServices>
  </scripting> 
</system.web.extensions> 

这是在 web.config

中增加 json 序列化的代码

代码:

 <system.web.extensions>
 <scripting>
 <webServices>
    <jsonSerialization maxJsonLength="2147483647"/>
 </webServices>
 </scripting>
 </system.web.extensions>