Как правильно реализовать поиск на ajax?

Question

[efimenko_b]

Не знаю как правильно сформулировать вопрос, поэтому все по порядку.
У меня есть поиск на ajax
Обычная отправка формы, кратко jquery при сабмите:

var val = $(this).find('input').val();
$.ajax({
			type: "POST",
			url: "search.php",
			dataType: 'json',
			data: data,
			success: function(data){
				$("#ajaxcontent").html(data['content']);
				history.pushState(null,null, "search.php?search="+val)
			},
		});

В PHP делаю выборку с БД и в цикле накапливаю записи, и закидываю в массив, который возвращаю:

while($item = mysql_fetch_assoc($books)){
		$json['content']  = $json['content'] . 'Контент';
	};
	echo json_encode($json);

Все отлично работает.
Что хочу сделать:
1)При отправлении формы, формируется адресная строка history.pushState(null,null, "search.php?search="+val), для того что бы пользователь мог отправить ссылку любому другому юзеру, что бы тот получил такой же результат.
Так вот как это лучше реализовать?
по скольку search.php то мне возвращает просто массив, а не страницу.
И стоит ли вообще так делать?
Как по мне, это очень даже удобно.
Может есть какие то статьи на подобные темы?
Заранее спасибо, буду рад любой помощи, критике, совету.

Answer 1

[Илья Шатохин]

по скольку search.php то мне возвращает просто массив, а не страницу.

Сделайте на POST запросы к "search.php" возврат массива (json), а на GET запросы к "search.php" страницу с уже отрендеренным результатом (html).

Answer 2

[Дмитрий Филимонов]

Я бы все переделал в таком случае: для поиска нужно сделать отдельную страницу, настоящую, формируемую на бэкенде, с URL вида http://.../search/запрос/, например. И по ajax обращаться, например, на http://.../search/запрос/?json=1 (это все GET, никаких POST для этой задачи) и получать там объект, который рендерить на клиенте (потребуется шаблонизатор, ибо без него некрасиво), либо получать часть страницы, уже сформированную, которую просто $(...).html(...). Этот же подход можно использовать для любых страниц, которые надо по-настоящему отдавать (поисковым ботам, прямым заходам), но при этом быстро все грузить без обновления страницы.

Либо же при заходе на страницу брать location.search и делать запрос, но это менее некрасивый вариант.

Посоветовал бы еще почитать про фрейворки-библиотеки что на клиенте, что на сервере, ибо mysql_fetch_assoc и history.pushState в коллбеке в 21 веке - это жесть. :)

Comments

[Илья Шатохин]

"?json=1" можно не дописывать, достаточно смотреть какой запрос на входе: xhr или нет.

[Дмитрий Филимонов]

Илья Шатохин: да, в данном случае проверять заголовок красивее. Но потенциально более геморрно (если по пути прокси или запросы кэшируются).