Рендеринг изображения с php выводом его с тегом html <img> - PullRequest
Новая
       49

Рендеринг изображения с php выводом его с тегом html <img>

3 голосов
/ 21 января 2012

У меня есть класс с несколькими функциями, которые могут отображать изображения. 

// render.php
class Render {
   public function Render($some_arguments) {
      ...
      header("Content-Type: image/png");
        $im = @imagecreate(110, 20)
            or die("Cannot Initialize new GD image stream");
        $background_color = imagecolorallocate($im, 0, 0, 0);
        $text_color = imagecolorallocate($im, 233, 14, 91);
        imagestring($im, 1, 5, 5,  "A Simple Text String", $text_color);
        imagepng($im);
        return "data:image/png;base64,".base64_encode($im);
   }
}

Тогда у меня есть php-файл, который содержит html-код и где я хотел бы вывести изображение в теге < img>: 

// index.php
include("render.php");
$render = new Render();
echo "<htlm><head></head><body>";
echo "<img src=\"".$render->Render(1)."\" />";
echo "</body></html>";

Когда я запускаю index.php в своем браузере, я просто получаю пустой экран.

Разве я не могу использовать вызов функции в качестве источника изображения? Я знаю, что могу использовать php-файл в качестве источника, например < img src="render_image.php" />, но тогда я не могу посылать какие-либо аргументы объектно-ориентированным способом (я знаю, что могу использовать $ _GET для получения аргументов), но я бы хотел сделать это с хороший объектно-ориентированный письменный код.

Итак, есть ли способ использовать вызов функции в качестве источника HTML-тега?

Ответы [ 4 ]

4 голосов
/ 21 января 2012

Вы можете BASE64 кодировать изображение и использовать схему URL данных: 

data:[<MIME-type>][;charset=<encoding>][;base64],<data>

например. 

<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==" alt="Red dot">

Итак, если вы включите это вместо необработанного изображения, вы сможете делать именно то, что вам нужно.

(Примеры из Wikipediea )

3 голосов
/ 21 января 2012

Вам придется разделить его:

Render(...) напишет временный файл (со случайным именем), который будет доступен из Интернета в течение некоторого времени.

Новый метод Output() вернет случайное имя, упомянутое выше.

Затем вы вызываете Render() перед выводом HTML и встраиваете URL, используя Output().

В качестве альтернативы вы можете использовать какой-то файл или базу данных для обмена параметрами, по сути, какой-нибудь метод Prepare(...)? запись параметров в файл или базу данных и Render() чтение этих параметров и размещение файла снова и т. д.

В качестве еще одной альтернативы (без записи в файловую систему): вы можете реализовать включение данных изображения, используя data: uri, но размер изображения будет ограничен в зависимости от используемого браузера, и вы не сможете кэшировать данные таким образом (то есть вы должны отправить его все время).

В зависимости от того, чего вы пытаетесь достичь, вам может повезти, встраивая SVG-изображение. Это дало бы огромное преимущество - быть на месте, при этом используя меньше полосы пропускания, быть масштабируемым и т. Д. Недостатком является то, что это поддерживается только в новейших браузерах (аналогично data:), но ограничений по размеру нет.

Редактировать: Используя base64 / внедренный подход, он становится немного сложнее, что приводит к чему-то вроде этого (не проверено, но должно работать): 

ob_start(); // buffers future output
imagepng($img); // writes to output/buffer
$b64 = base64_encode(ob_get_contents()); // returns output
ob_end_clean(); // clears buffered output
2 голосов
/ 21 января 2012

Наиболее вероятная причина появления пустого экрана связана с двумя отправляемыми данными заголовка.Итак, во-первых, вы выполняете этот оператор: 

echo "<htlm><head></head><body>";

, который автоматически устанавливает тип содержимого данных, отправляемых в браузер.Далее вы запускаете эту строку: 

echo "<img src=\"".$render->Render(1)."\" />";

, которая затем приводит к запуску этой строки: 

header("Content-type: image/png");

Затем выполняется попытка установить другой заголовок на тот, который уже был отправленПервым оператором echo.

Я рекомендую изменить функцию Render (), чтобы она принимала имя файла, затем записать изображение в этот файл и вернуть путь, указывающий на записанный файл изображения.Таким образом, вы не пытаетесь вывести файл изображения и HTML-файл в одном потоке в браузер.

С уважением, Ralfe

1 голос
/ 21 января 2012

У меня была почти такая же проблема некоторое время назад.Вы можете найти решение и некоторые возможные проблемы здесь: Встроенные изображения, превышающие длину

Основное, я думаю, вы ищете это <img src="data:image/png;base64,[data in base64]"/>

...