您好，我将直接通过用例介绍我的问题:我正在开发一种配置器，并且我有一个网页(我们称之为 page1)，用户可以在其中上传图像。图片通常显示在 img 标签中。当用户上传图片后，他可以进入下一页(我们称之为第 2 页)。现在，在此页面2 上，我想显示用户上传的图片而不存储图片。到目前为止，这是我尝试过的:
在执行此操作之前，我在 json 中直接插入了图像的 src 属性。但是浏览器给了我 GET 请求太长或类似的错误。因此，我找到了使用 base64 转换图像的解决方案:
function getBase64Image(img) {
var canvas = document.createElement("canvas");
canvas.width = img.width;
canvas.height = img.height;
var ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0);
var dataURL = canvas.toDataURL("image/png");
return dataURL.replace(/^data:image\/(png|jpg);base64,/, "");
}
function sendSelectedProducts()
{
var logo = document.getElementsByName('logo-container')[0];
var base64 = getBase64Image(logo);
console.log(base64);
var json_string = '{"img": "' + base64 + '" }';
console.log(json_string);
window.location.replace('riepilogo.php?prodotti=' + json_string);
}
因此，我对这段代码所做的是发送一个带有 base64 转换图像的 Json。在 PHP 端，这是尝试将图像转换回的代码:
function base64ToImage($base64_string, $output_file) {
$file = fopen($output_file, "wb");
$data = explode(',', $base64_string);
fwrite($file, base64_decode($base64_decode));
fclose($file);
return $output_file;
}
echo '<p>'.$img.'</p>';
echo '<a class="cart-image" href="#"><img src="'.base64ToImage($img, 'logo_file.jpg').'" alt="logo"></a>'?>
此代码不起作用，我正在寻找不在服务器上存储图像的解决方案。我该怎么办？
最佳答案
您不需要从 base64 解码图像，只需这样做:
echo '<a class="cart-image" href="#"><img src="data:'.$img.'" alt="logo"></a>'?>
其中 $img 是 base64 格式的图像。有关详细信息，请参阅:How to display Base64 images in HTML?
关于javascript - 如何在不存储的情况下将刚刚上传的图像发送到 php？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/56669086/