使用JavaScript将画布图像上传到Imgur（API v3）

Question

我正在构建一个有趣的Chrome实验，名为Mustache Mirror！http://sjoerddijkstra.nl/cam/ 我想使用Imgur API V3将画布中的图像上传到Imgur，并显示链接，但我真的不知道该怎么做。我找到的所有有效示例都使用V2 API... 我使用canvas.toDataURL：

var dataURL = canvas.toDataURL("image/png");
return dataURL.replace(/^data:image\/(png|jpg);base64,/, "");

- Sjoerd Dijkstra

---

非常有趣的应用程序！ - samuraiseoul

Answer 1

我认为Imgur的文档有点贫乏，但在Stack Overflow上询问后，我发现以下方法可行：

try {
    var img = document.getElementById('myCanvas').toDataURL('image/jpeg', 0.9).split(',')[1];
} catch(e) {
    var img = document.getElementById('myCanvas').toDataURL().split(',')[1];
}

$.ajax({
    url: 'https://api.imgur.com/3/image',
    type: 'post',
    headers: {
        Authorization: 'Client-ID <CHANGE_THIS_TO_BE_YOUR_CLIENT_ID>'
    },
    data: {
        image: img
    },
    dataType: 'json',
    success: function(response) {
        if(response.success) {
            window.location = response.data.link;
        }
    }
});

将<CHANGE_THIS_TO_BE_YOUR_CLIENT_ID>替换为您在此处注册应用程序时获得的客户端ID（我选择了“匿名使用而无需用户授权”选项）。

- user967451