使用 Grails 从画布上传图像答案

【问题标题】：Uploading an image from canvas with Grails使用 Grails 从画布上传图像
【发布时间】：2012-02-01 03:50:00
【问题描述】：

具有以下域类：

class Topic {
    byte[] image
}

它是控制器：

class TopicController {

def uploadImage () {
        println params
        if(params.image && params.id && params.image.length != 0){
            def topic = Topic.get(params.id)
            topic.image = params.image
        }
    }

}

还有ajax请求：

function postImage(){
    var topicId = $('#topic-id').attr('value');
    var imageData = context.getImageData(0,0,canvas.width, canvas.height);
    $.post("../uploadImage", {'id': topicId,'image': imageData.data});
}

未启用发送图像数据 (imageData.data)。什么是正确的方法？当我删除对图像的所有引用时，没关系，但不是我想要的。在另一种情况下，在控制器一侧（params map）既没有检测到 id 也没有检测到图像。

UPDATE：问题就这样解决了。控制器方法：

def uploadImage() {
    //println params
    if(params.image && params.id){
        def topic = Topic.get(params.id)
        topic.image = Base64.decode(params.image)
    }
}

JS函数：

function postImage(){
        var topicId = $('#topic-id').attr('value');
        var image = canvas.toDataURL("image/png");
        image = image.replace('data:image/png;base64,', '');
        $.post("../uploadImage", {'id': topicId,'image': image});
    }

但我继续在浏览器端收到下一条消息：

Failed to load resource: the server responded with a status of 404 (Not Found)
POST ../uploadImage 404 (Not Found)

我应该怎么做才能解决它？

【问题讨论】：

标签： ajax image grails upload html5-canvas

【解决方案1】：

要解决您的剩余问题，请尝试在您的 uploadImage 方法的末尾呈现一些内容：

def uploadImage() {
    //println params
    if(params.image && params.id){
        def topic = Topic.get(params.id)
        topic.image = Base64.decode(params.image)
    }

    render 'Success'
}

如果您不执行导致响应提交的操作（例如render() 或redirect()），Grails 将尝试呈现与操作同名的视图（在您的情况下为uploadImage.gsp )。

【讨论】：