1

キャンバスからレンダリングされた画像のbase64文字列を含むデータを送信するには、ajaxを送信する必要があります。

送信するとき、Chromeインスペクターのネットワークパネルを見ると、すべてが正常に表示されます。「フォームデータ」には、送信するすべてのデータが一覧表示されます。

しかし、Grailsではデータを取得できませんparams。コントローラー名とアクション名だけが含まれています。したがって、私が単純で得るものはすべてparams.dataNamenullです。

投稿リクエストのサイズに何かがあると思いますが、以前にajaxを使用せずにこれを行ったことがあるので、よくわかりません。

これは、jqueryajaxを使用してアップロードするための私のコードです。

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 に答える