Как встроить изображения в единственный HTML / файл PHP?
Я создаю легкий, однофайловый инструмент администрирования баз данных, и я хотел бы связать некоторые маленькие значки им. Что лучший способ состоит в том, чтобы встроить изображения в файл HTML/PHP?
Я знаю метод с помощью PHP, где я назвал бы тот же файл с ПОЛУЧИТЬ параметром, который произведет hardcoded двоичные данные с корректным заголовком, но это кажется немного сложным.
Я могу использовать что-то для передачи изображения непосредственно в CSS background-image объявление? Это позволило бы мне использовать метод спрайта CSS.
Поддержка браузера не является проблемой здесь, таким образом, более экзотические методы приветствуются также.
Править
У кого-то есть ссылка/пример на то, как генерировать URL Данных правильно с PHP? Я фигурировал бы echo 'data:image/png;base64,'.base64_encode(file_get_contents('image.png')) был бы достаточен, но я мог быть неправым.
3 ответа
Решением для вставки изображения непосредственно в HTML-страницу будет использование схемы data URI
Например, вы можете использовать часть HTML, которая выглядит следующим образом:
<img src="data:image/png;base64,
iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAABGdBTUEAALGP
C/xhBQAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAd0SU1FB9YGARc5KB0XV+IA
AAAddEVYdENvbW1lbnQAQ3JlYXRlZCB3aXRoIFRoZSBHSU1Q72QlbgAAAF1J
REFUGNO9zL0NglAAxPEfdLTs4BZM4DIO4C7OwQg2JoQ9LE1exdlYvBBeZ7jq
ch9//q1uH4TLzw4d6+ErXMMcXuHWxId3KOETnnXXV6MJpcq2MLaI97CER3N0
vr4MkhoXe0rZigAAAABJRU5ErkJggg==" alt="Red dot" />
На странице Википедии, на которую я дал ссылку, есть и другие решения:
- включение изображения как CSS-правило
- использование Javascript.
Но обратите внимание, что эти решения будут работать не во всех браузерах - вам решать, приемлемо это или нет в вашей конкретной ситуации.
Edit : чтобы ответить на заданный вами вопрос о том, "как правильно генерировать URL данных с помощью PHP", загляните чуть ниже на страницу википедии о схеме URI данных, где приводится эта часть кода (цитирование) :
function data_uri($file, $mime)
{
$contents = file_get_contents($file);
$base64 = base64_encode($contents);
return ('data:' . $mime . ';base64,' . $base64);
}
?>
<img src="<?php echo data_uri('elephant.png','image/png'); ?>" alt="An elephant" />
Для одного сценария на стороне сервера PHP попробуйте кодирование изображения base64 и используйте простую логику в стиле контроллера:
<?
/* store image mime-type and data in script use base64 */
$images = array('photo.png' => array('mimetype' => 'image/png',
'data' => '...'));
/* use request path, e.g. index.php/photo.png */
$action = substr($_SERVER['PATH_INFO'], 1);
switch($action) {
case (preg_match('/\.png$/', $action)?$action:!$action):
header("Content-Type: {$images[$action]['mimetype']}");
/* use expires to limit re-requests on navigation */
$expires = gmdate('D, d M Y H:i:s \G\M\T', filetime(__FILE__) + 365*24*60*60);
header("Expires: {$expires}");
$data = base64_decode($images[$action]['data']);
header('Content-Length: ' . strlen($data));
echo $data;
break;
...
}
?>