javascript - Canvas 数据到图像

Question

我正在使用 canvas.toDataURL 将图像保存为索引数据库中的文本，当我检索数据时我想将该数据转换为图像，问题是我收到一条错误消息 请求 URI 太长 http 状态代码 414

var c = document.createElement('canvas');
c.width = 400;
c.height = 360;
var ctx = c.getContext('2d');
var img = new Image();
img.onload = function () {
    ctx.drawImage(this, 0, 0, 400, 360);
}
img.src = doc.src; // adding the data to the image

尝试了上面的代码，希望我能转换数据，但它不起作用。

Answer 1

我尝试了长度为 14115 个字符的图像源，它对我来说效果很好:

$('body').append('<img src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEAYABgAAD/2wBDAAgGBgcGBQgHBwcJCQgKDBQNDAsLDBkSEw8UHRofHh0aHBwgJC4nICIsIxwcKDcpLDAxNDQ0Hyc5PTgyPC4zNDL/2wBDAQkJCQwLDBgNDRgyIRwhMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjL/wAARCAG5AmsDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwD5/ooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiniKRhlY2I9hSMjIcMpU+4xQK6G0UUUDCiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKekMsv+rjd/91SaAbtuMopWVkYqykEdQRikoAKKKKACiiigAooooAKKKkSCWQZSJ2H+ypNAm0tyOinPG8Zw6Mp9CMU2gYUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFA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VP8Al/hP1gWvPaKOVCVGmuh0HiHxprvii4hn1W8Mrw/6vaoUL+VbOn/FvxhpsSRQ6krxoAAskStxXDUUOKe43Tg9LHpY+OfjEIV8203f3vJFcr4k8a674sdDq16ZVT7sajao/AVz1FCSQRpwjsgoooplhRRTkIVwTzg0ATRWdzOMxwSMPUKa+gfhPpU2geFp769LIsgMmxs8AD0/Cs/wv8TfAdhoNpbXtnJDcxxhZNtsGBOOua3z8Y/Aezb514U6bPsxxj0rJpytc8nEfWa3u8tkeFeMfEN34g8SXd9O5JLlUyMYQHAH5YrnK6/x/wCI9M8R+JJbvR7Rba0KhACgUscdcCuQrU9GimoJNWNXRPEWq+HrsXOmXbwOOwPB+oruIvjr4wRArPZuf7xhrzKik4p6lSpwk7tHSeJvHWv+LJFbVL0tGvSKIbEH4Vzpck8YHsKbRTKUUtEdn4d+J/ibw1ZraWVzE8CnhZk34+hrWuPjj40uFIS4tIR/sQDP615tRS5UR7KF72PQ5/jV40uLZoGvYEVl2lkgAbH1rgJp3nkLyNuYksT6k1HRQlYpQjHZG/4Z8Y6v4Sunn0uZVLjDK67lP4U/xR411rxhPDLq06P5K7UWNAoA/wAmudoosr3DkjfmtqLSUUUyjs/D/wAUPE3hrThY6fcwiFTlfMiDEfSuZ1TVLvWNRnvr2Uy3E7b3Y9zVKikklsSoRTukFSQyvBMksbYdCGU+hqOimUd5P8XvF1xpD6a95CIXj8tmWIByv1rh/OkH8VR0UkktiI04x2QUUUUywooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKAP/9k=" />');

您可以从服务器输出图像作为文件。

例如在 PHP 中它可能看起来像

<?php

/** 
 * getImageSource($imageId) function 
 * should retrieve saved image data URI from database
 * 
 * @param int $imageId An ID of record in database,
 * that is containing the image data URI.
 *
 */
function getImageSource($imageId) {
    // stub:
    $dataURI = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAABlBMVEUAAAD///+l2Z/dAAAAM0lEQVR4nGP4/5/h/1+G/58ZDrAz3D/McH8yw83NDDeNGe4Ug9C9zwz3gVLMDA/A6P9/AFGGFyjOXZtQAAAAAElFTkSuQmCC';

    // You can retrieve correct MIME type from saved data URI
    // accordingly to this format:
    // data:[<MIME-type>][;charset=<encoding>][;base64],<data>

    $parts = preg_split('/,/', $dataURI);
    // here you can also retrieve mime type and encoding.
    return base64_decode($parts[1]);
}

$imageId = isset($_GET['img_id']) ? $_GET['img_id'] : -1;

header('Content-Type: image/png');
echo getImageSource($imageId);

然后在 HTML 中你可以编写类似的内容

<img src="http://mysite.com/image.php?img_id=12345" />