如何缓存imagick生成的图片?
How to cache images generated by imagick?
我正在使用下面的函数生成带有文字的图像。我想知道如何才能使图像只为用户生成一次,然后将图像缓存在他们的浏览器中。我的目标是节省服务器资源。
我的 imagick 代码看起来还不错吗?我担心我可能会发生某种内存泄漏。感谢您的帮助
function small_image($username){
$file_content = file_get_contents("https://example.com/wp-content/uploads/2019/04/image.jpg");
$imagick = new Imagick();
$imagick -> readImageBlob($file_content);
$draw = new ImagickDraw();
$pixel = new ImagickPixel( 'gray' );
$draw->setFillColor('white');
/* Font properties */
$draw->setFont('Utopia');
$draw->setFontSize( 50 );
$geo=$imagick->getImageGeometry();
$imagick->annotateImage($draw, 60, 185, 0, $username);
$imgBuff = $imagick->getImageBlob();
$imagick->clear();
$img = base64_encode($imgBuff);
$imagick -> destroy();
return "<img id='imagick-banner' width=500 alt='Embedded Image' src='data:image/png;base64,$img' />";
}
您提到过节省服务器资源,因此请尝试让客户端浏览器完成这项工作。此方法的一个警告是用户必须拥有正确的字体,否则您必须在网站上提供字体。
HTML
<canvas id="userImage"></canvas>
JavaScript
window.onload = function() {
var canvas = document.getElementById("userImage");
var context = canvas.getContext("2d");
var imageObject = new Image();
imageObject.onload = function(){
context.drawImage(imageObj, 10, 10);
context.font = "50pt Utopia";
context.fillText(username, 60, 185);
};
imageObject.src = userImageURI;
document.getElementById('userImage').appendChild(imageObject);
};
作为使用 imagick 的更严格的答案,请尝试在 JavaScript 中使用 localStorage(让您的 php 第一次处理它并使用 JavaScript 来决定何时请求新图像)。
localStorage.setItem("userImage", base64data);
var userImage = document.body.appendChild("img");
userImage.setAttribute('src', "data:image/png;base64, " + localStorage.getItem("userImage"));
我正在使用下面的函数生成带有文字的图像。我想知道如何才能使图像只为用户生成一次,然后将图像缓存在他们的浏览器中。我的目标是节省服务器资源。
我的 imagick 代码看起来还不错吗?我担心我可能会发生某种内存泄漏。感谢您的帮助
function small_image($username){
$file_content = file_get_contents("https://example.com/wp-content/uploads/2019/04/image.jpg");
$imagick = new Imagick();
$imagick -> readImageBlob($file_content);
$draw = new ImagickDraw();
$pixel = new ImagickPixel( 'gray' );
$draw->setFillColor('white');
/* Font properties */
$draw->setFont('Utopia');
$draw->setFontSize( 50 );
$geo=$imagick->getImageGeometry();
$imagick->annotateImage($draw, 60, 185, 0, $username);
$imgBuff = $imagick->getImageBlob();
$imagick->clear();
$img = base64_encode($imgBuff);
$imagick -> destroy();
return "<img id='imagick-banner' width=500 alt='Embedded Image' src='data:image/png;base64,$img' />";
}
您提到过节省服务器资源,因此请尝试让客户端浏览器完成这项工作。此方法的一个警告是用户必须拥有正确的字体,否则您必须在网站上提供字体。
HTML
<canvas id="userImage"></canvas>
JavaScript
window.onload = function() {
var canvas = document.getElementById("userImage");
var context = canvas.getContext("2d");
var imageObject = new Image();
imageObject.onload = function(){
context.drawImage(imageObj, 10, 10);
context.font = "50pt Utopia";
context.fillText(username, 60, 185);
};
imageObject.src = userImageURI;
document.getElementById('userImage').appendChild(imageObject);
};
作为使用 imagick 的更严格的答案,请尝试在 JavaScript 中使用 localStorage(让您的 php 第一次处理它并使用 JavaScript 来决定何时请求新图像)。
localStorage.setItem("userImage", base64data);
var userImage = document.body.appendChild("img");
userImage.setAttribute('src', "data:image/png;base64, " + localStorage.getItem("userImage"));