Ответ 1

ПЕРВЫЙ ВОПРОС:

Вы должны добавить элемент img вместо этого, чтобы установить текст следующим образом:

$('#imagesofBadges').append('<img src="'  + data[0].BadgeImage + '"/>');

ВТОРОЙ ВОПРОС:

При добавлении изображений добавьте атрибут класса, чтобы вы могли получить их с помощью jQuery с помощью этого имени класса следующим образом:

var $img = $('<img src="'  + data[0].BadgeImage + '"/>'); // create the image
$img.addClass('badge-image'); // add the class .badge-image to it
$('#imagesofBadges').append($img); // append it

Теперь вы можете получить эти изображения с помощью селектора, например:

$('#imagesofBadges .badge-image'); // will fetch all the elements that have the class .badge-image that are inside #imagesofBadges.

EDIT:

если вы хотите удалить все изображения внутри #imagesofBadges, прежде чем добавлять новые, используйте это:

// fetch all the images inside #imagesofBadges and remove them
$('#imagesofBadges img').remove();
// append the new image
$('#imagesofBadges').append('<img src="'  + data[0].BadgeImage + '"/>');

Ответ 2

Прежде всего, полученная вами ошибка не имеет ничего общего с POST, AJAX или PHP. Это вызвано слишком общим запросом LDAP:

ldap_search(): Partial search results returned: Size limit exceeded

Каждый вызов jQuery может возвращать только один образ, поэтому вам нужно получить миниатюры по одному, и каждый вызов должен искать и возвращать только одну запись (т.е. READ, а не ПОИСК).

Это означает, что вам нужно отправить свой идентификатор пользователя в вызове PHP, чтобы script мог знать, какой эскиз для возврата... и это вы делаете.

Но PHP не использует эту информацию. Вы ищете все имена, что означает, что он не может работать в любом случае, но он даже не запускается, потому что поиск LDAP захлебывается.

$search_filter = '(&(objectCategory=person)(samaccountname=*))';

В приведенной выше строке вам нужно добавить некоторый фильтр. Например, является ли имя ID, которое вы получаете в таблице лидеров, имя учетной записи SAM? Если это так, вы можете сделать что-то вроде

$kid = 'NonExistingAccount';
if (preg_match('#SAM_NAME_MATCHING_REGEX#', $_POST['id'])) {
    $kid = $_POST['id'];
}
$search_filter = "(&(objectCategory=person)(samaccountname={$kid}))";

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

$bitmap = $entries[0]['picture'];
// Some error checking would probably be good
$gd     = imageCreateFromString($bitmap);
// Here you'll probably want to resize your image. Create
// another GD object with ImageCreateTrueColor and use imageCopyResampled
// with the appropriate size.

// Then, inform jQuery that a PNG is coming along
header('Content-Type: image/png');
// and send the PNG
imagePNG($gd);
// and nothing else (shouldn't matter, but you never know, and anyway...).
exit();

Пример

У вас есть раздел HTML, содержащий несколько элементов (скажем, ваших сотрудников).

ОЧЕНЬ ВАЖНО: этот раздел будет сгенерирован PHP с использованием поиска LDAP, чтобы у вас была необходимая информация. Возможно, вам придется разбивать страницы на поиск LDAP, чтобы избежать слишком большого количества возвращаемых результатов (и ошибки), как и раньше.

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

<ul class="leaderboard">
   ...
   <li data-dn="CN=Jeff Smith,OU=Sales,DC=Fabrikam,DC=COM">
       <img class="placeholder" />
           <span class="cn">Jeff Smith</span>
           <span class="ou">Sales</span>
   </li>
   ...
</ul>

В приведенном выше примере вы читаете "Jeff Smith" и т.д. из поиска LDAP. Но вы не можете легко разместить изображение там с PHP, HTML не позволяет (хорошо, он делает это, так как этот ответ на аналогичный вопрос, как ваш показывает, но скажите, что вы предпочитайте не делать этого), поэтому вместо этого вы помещаете вместо него подходящий размер с помощью CSS.

Вы также можете поместить анимированный GIF, который говорит "загрузка..." на изображении.

Чтобы сделать вещи более эффективными, вы сохраняете в атрибуте data-dn DN каждого результата.

При нажатии или onload(), или если у вас есть пейджинг AJAX на странице, вы получаете все изображения. Это очень похоже на код, который у вас уже есть.

$('.leaderboard li').on('click', function () {
    // Get the image. This returns nothing if it has already been loaded.
    var img = $(this).find('img.placeholder');
    if (img.length === 0) { return; }
    var dn = $(this).attr('data-dn');

    // Load image from its DN.
    // See https://stackoverflow.com/questions/4285042/asychronously-load-images-with-jquery
    img.src = 'load-image.php?dn=' + dn;
});

load-image.php script получит $_GET['dn'] и потребует выполнить чтение LDAP используя поставляемый DN и получить соответствующий атрибут изображения.

Затем вы просто выводите его с помощью функции header() и image*(), которую вы предпочитаете (например, imageJPEG() или imagePNG()).

Вы можете сделать это в AJAX и отправить изображения, закодированные как base64 (код в ссылке выше), но это сложнее, и время, когда вы сохраняете отправку только одного вызова вместо двадцати для двадцати изображений, быстро теряется с интересом, когда вам нужно отправить по JPEG файлам, закодированным как base64 вместо двоичного, с увеличением на 5-10%, если ваш веб-сервер gz-кодирует base64 (или увеличение на 33%, если это не так).

Ответ 3

Используйте что-то вроде

$('#imagesofBadges').append($("<img>").prop("src", data[0].BadgeImage));