如何使用 jQuery 将图像发布到 WebMethod？答案

【问题标题】：How to POST an image to a WebMethod using jQuery?如何使用 jQuery 将图像发布到 WebMethod？
【发布时间】：2014-11-02 19:04:11
【问题描述】：

我有一个 ASP.NET WebMethod，如下所示。

    [WebMethod]
    public static void AddCameraImage(string imageArray)
    {
       //do something
    }

我正在从canvas 读取图像并希望使用以下代码将图像发布到上述方法：

$("#imageUl li").each(function (index, item) {
  console.log($(this).find("canvas")[0].toDataURL("image/png"));
  //This log is working properly. It's logging a very big string.  "data:image/png;base64,iVBORVl3APD/AwWGMo8iBuQmCC...."
  //I've truncated the string here.
  $.ajax({
    type: "POST",
    url: "Default.aspx/AddCameraImage",
    data: '{ "imageArray": "' + $(this).find("canvas")[0].toDataURL("image/png") + '"}',
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function (data) {
       },
    failure: function (response) {
          alert("Failed to add image");
       }
    });
 });

但它显示的是POST http://localhost:1315/Default.aspx/AddCameraImage 500 (Internal Server Error)

但是如果我将 ajax 请求的data 属性更改为data: '{ "imageArray": "' + "test_hardcode_data" + '"}',，它就可以正常工作。

我在这里缺少什么？

【问题讨论】：

尝试像这样传递数据 - data: '{ "imageArray": "' + $(this).find("canvas")[0].toDataURL("image/png").replace(/^data:image\/(png|jpg);base64,/, "")
仍然出现同样的错误。

标签： jquery asp.net ajax canvas webmethod

【解决方案1】：

我认为你应该增加 web.config 中的 maxJsonLength。如果我记得很清楚，默认值是 100k 左右，可能还不够你的照片。并在“error:function(a,b,c){”中更改“failure:function(response){”，在里面设置一个断点并检查3个变量的内容，它应该告诉你大小限制错误。

【讨论】：