В этом документе описывается, почему и как запрашивать изображение с помощью HTTP POST.
Обзор
Если вы запрашиваете изображение в коде или вам нужен URL-адрес длиной более 2 000 символов, вам нужно будет отправить запрос изображения с помощью HTTP POST. Сервер инфографики поддерживает запросы HTTP POST длиной до 16 КБ.
Вот пример самого простого типа POST-запроса: использование элемента <form> :
Это изображение на самом деле является страницей, размещенной в <iframe> . Вот код формы:
<form action='https://chart.googleapis.com/chart' method='POST'> <input type='hidden' name='cht' value='qr' /> <input type='hidden' name='chs' value='300x300' /> <input type='hidden' name='chl' value='This is my QR code'/> <input type='submit' /> </form>
Ответом на действительный запрос POST является изображение PNG, такое же, как и ответ на запрос GET.
Совет: Некоторые браузеры кэшируют запросы к определенному URL-адресу, поэтому даже если вы измените параметры POST, браузер фактически не будет запрашивать сервер изображений. Это может вызвать проблемы при попытке перезагрузить изображение, которое часто меняется (что может стать проблемой во время тестирования). Чтобы обойти эту проблему, добавьте ?chid= value в конце URL-адреса POST, где value меняется с каждым запросом: сервер изображений будет игнорировать этот параметр, и браузер повторно отправит запрос, а не просто перезагрузит кэшированную версию.
Существует несколько способов использования POST, и все они требуют дополнительного написания кода либо в коде страницы, либо на сервере, на котором размещена страница. Чтобы использовать POST, вы обычно создаете отдельную страницу для каждого изображения и встраиваете или ссылаетесь на эти страницы на свою главную страницу с помощью <iframe> или тегов <img> , как показано ниже.
Вот примеры использования POST как с JavaScript, так и с PHP.
Использование JavaScript для POST-запроса
Самый простой способ выполнить POST-запрос JavaScript — создать страницу, на которой размещена форма с данными изображения в элементах <input> , и заставить страницу POST запросить запрос в своем обработчике onLoad() , и страница будет заменена изображением. PNG. Страница, на которой размещено это изображение, должна включать эту страницу с помощью <iframe> . Вот код страницы изображения:
Примечание. В приведенном ниже примере параметр chid имеет изменяющееся значение в URL-адресе. Это приводит к обновлению браузера по причине, описанной в совете выше. Если ваше изображение меняется нечасто, вам не нужно добавлять этот параметр.
post_infographic.html
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type='application/javascript'>
// Send the POST when the page is loaded,
// which will replace this whole page with the retrieved image.
function loadGraph() {
var frm = document.getElementById('post_form');
if (frm) {
frm.submit();
}
}
</script>
</head>
<body onload="loadGraph()">
<form action='https://chart.googleapis.com/chart' method='POST' id='post_form'
onsubmit="this.action = 'https://chart.googleapis.com/chart?chid=' + (new Date()).getMilliseconds(); return true;"> <input type='hidden' name='cht' value='qr' />
<input type='hidden' name='cht' value='qr' />
<input type='hidden' name='chs' value='300x300' />
<input type='hidden' name='chl' value='This is my QR code' />
<input type='submit' />
</form>
</body>
</html> Если вы используете элемент <form> , вам не нужно URL-кодировать строки.
Затем это изображение можно загрузить на другую страницу, используя <iframe> на вашей главной странице, например:
другая_страница.html
<iframe src="post_infographic.html" width="300" height="200"></iframe>
Использование PHP для POST-запроса
Большинство серверных языков поддерживают явные запросы POST. Вот пример выполнения запроса POST с использованием PHP. В этом примере показана страница, генерирующая QR-код со 150 случайными значениями. Чтобы использовать это самостоятельно, вам нужно настроить массив $qrcode , включив в него свои собственные значения.
Примечание. В приведенном ниже примере параметр chid имеет изменяющееся значение в URL-адресе. Это приводит к обновлению браузера по причине, описанной в совете выше. Если ваше изображение меняется нечасто, вам не нужно добавлять этот параметр.
imageserver-image.php
<?php
// Create some random text-encoded data for a QR code.
header('content-type: image/png');
$url = 'https://chart.googleapis.com/chart?chid=' . md5(uniqid(rand(), true));
$chd = 't:';
for ($i = 0; $i < 150; ++$i) {
$data = rand(0, 100000);
$chd .= $data . ',';
}
$chd = substr($chd, 0, -1);
// Add image type, image size, and data to params.
$qrcode = array(
'cht' => 'qr',
'chs' => '300x300',
'chl' => $chd);
// Send the request, and print out the returned bytes.
$context = stream_context_create(
array('http' => array(
'method' => 'POST',
'content' => http_build_query($qrcode))));
fpassthru(fopen($url, 'r', false, $context));
?> Встроить это изображение проще, чем в примере с JavaScript, поскольку вы можете просто указать на свою страницу POST с помощью тега <img> , как показано здесь:
другая_страница.html
<img width='300' height='300' src='imageserver-image.php'>