1

我需要让 ajax 提交来提交一些数据,包括图像的 base64 字符串,它是从画布渲染的。

提交时,我查看 Chrome 检查器的网络面板,一切正常,在“表单数据”中列出了我要提交的所有数据。

但是在 Grails 中我无法获取数据, 中没有任何内容params,只有控制器名称和操作名称。因此,我得到的一切params.dataName都是空的。

我想发布请求的大小有些问题,但我不太确定,因为我以前没有 ajax 就这样做过。

这是我使用 jquery ajax 上传的代码:

var imgBase64String = canvas.toDataURL("image/png");
imgBase64String = imgBase64String .replace('data:image/png;base64,', '');
var submitData = $(form).serializeArray();
submitData.push({name: "webImage", value: imgBase64String })
$.ajax({
    type: 'POST',
    url: '${createLink(action: 'myAction')}',
    data: submitData,
    dataType: "html",
    success: function(data){//Success code},
});

更新

params我在服务器端的代码,在检索数据的简单步骤中失败:

def myAction= {
        def paramData = params
        log.info "paramData: " + paramData

        def url = params.url
        def email = params.email
        def webImage = params.webImage
        log.info "param: url = " + url
        log.info "param: email = " + email
        log.info "param: webImage = " + webImage

        //Other implement code      
}

和输出:

2012-10-08 16:31:28,988 [http-bio-8080-exec-5] INFO  myController  - paramData: [action:myAction, controller:myController]
2012-10-08 16:31:28,989 [http-bio-8080-exec-5] INFO  myController  - param: url = null
2012-10-08 16:31:28,989 [http-bio-8080-exec-5] INFO  myController  - param: email = null
2012-10-08 16:31:28,989 [http-bio-8080-exec-5] INFO  myController  - param: webImage = null

我尝试提交的base64图像的大小是1998720,不知道是否有问题。

非常感谢。

4

1 回答 1

0

我相信你可以简单地在方法中canvas.toDataURL("image/png")传入data字段。$.ajax()也使用$.post()代替$.ajax(). 所以你的代码在 js 文件中应该是这样的:

$.post('/image/getCanvasImage',  //this is your url
  {
    img : canvas.toDataURL('image/jpeg'),
    email : email
  }, function(data){
      //whatever you wanna do with the returned data
  }
);

然后在您的操作中,导入import sun.misc.BASE64Decoder包,您可以编写以下代码来保存画布图像:

def file = params.img.toString().substring((params.img.toString().indexOf(",")+1),params.img.toString().size())
byte[] decodedBytes = new BASE64Decoder().decodeBuffer(file)
def image = new File("mySavedImage.jpg")
image.setBytes(decodedBytes)

应该管用!

于 2012-10-08T06:25:58.177 回答