Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Cookie, localStorage как сделать корзину? (https://javascript.ru/forum/dom-window/60670-cookie-localstorage-kak-sdelat-korzinu.html)

ivt22 13.01.2016 16:04

Cookie, localStorage как сделать корзину?
 
Добрый день, никак не могу разобраться как мне решить задачу, необходимо сделать что-то типо корзины товаров, но так что бы добавил товаров в корзину, перешел на другую страницу, а корзина с твоими товарами за тобой бегает и товары оттуда никуда не деваются, я пробовал Cookie, пробовал localStorage Вот тут даже пример есть http://incode.pro/javascript/sozdaem...alstorage.html
Но во всех вариантах, как только обновишь страницу или перейдешь на другую все данные из корзины пропадают, все Cookie очищаются и там уже нет ранее добавленных переменных, я думал каждое добавление товара записывать в файл с названием ввиде IP пользователя и потом при загрузке страницы читать этот файл и добавлять все товары обратно в корзину, так JavaScript не может ни создавать, ни записывать в файл ничего.

laimas 13.01.2016 16:52

Товар добавляется в корзину через сервер, то есть сервер должен знать об этом событии в любом случае, а значит и может их хранить у себя и выводить корзину на любой странице, а также записать и в Cookie клиенту, если надо. В localStorage может записать только клиент. Если у вас не сохраняется, значит не верно делалось. Код бы свой показали.

melst 13.01.2016 22:55

Я тоже сейчас над такой темой бьюсь. Я на jQuery делаю быструю корзину в определенном блоке на странице, чтоб без перезагрузки и делаю отдельную страницу корзины где уже просто PHP генерит.
Делаю файл обработчик, который срабатывает при нажатии "в корзину". Передается id товара и еще некоторые параметры с помощью ajax и в обработчике происходит выборка из БД и создание json. Json возвращается обратно в js и записывается в sessionStorage, а затем проверка по id на предмет повторений товаров и формирует быструю корзину. В обработчике данные остаются для последующего отображения на полноценной странице корзины.
Я примерно так придумал. Немного тов. Lemme помогает.

laimas 14.01.2016 11:34

Цитата:

Сообщение от melst
а затем проверка по id на предмет повторений товаров и формирует быструю корзину

О какой проверке речь и что значит "быстрая корзина"?

ivt22 14.01.2016 16:49

Цитата:

Сообщение от laimas (Сообщение 403608)
Товар добавляется в корзину через сервер, то есть сервер должен знать об этом событии в любом случае, а значит и может их хранить у себя и выводить корзину на любой странице, а также записать и в Cookie клиенту, если надо. В localStorage может записать только клиент. Если у вас не сохраняется, значит не верно делалось. Код бы свой показали.

http://incode.pro/javascript/sozdaem...alstorage.html

Так я вот это скопировал для примера

Или вот пытался пробовать
<a href="" onclick=setCookie("lastname", "Катя");>КУК</a>
	<a href="#" onclick=getcook();>||| Получить</a>


-----

function getcook()
  {
	alert(document.cookie);
  }
  
  //Установить Cookie
  function setCookie(name, value) {
    document.cookie = name + "=" + value;
  }


Кнопочкой КУК устанавливаю Cookie но если страницу обновить то тут же все исчезает. Видимо я как-то неправильно понял работу Cookie

laimas 14.01.2016 17:00

https://learn.javascript.ru/cookie

Но зачем именно куки? Если они устанавливаются только с параметром name, то это будут сессионные куки, которые не будут сохранены браузером после закрытия страницы. С тем же успехом сервер в свою сессию может записать данные корзины и выводить ее на страницах, ведь страницы все равно формирует он.

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

melst 14.01.2016 21:48

Цитата:

Сообщение от laimas (Сообщение 403695)
О какой проверке речь и что значит "быстрая корзина"?

)) "быстрая корзина" это я так обозвал блок где появляются товары без перезагрузки страницы, т.е. не основная страница корзины.
Проверку вот уже думаю делать когда данные в обработчик PHP поступают или в скрипте, когда данные назад приходят. Но при таком раскладе при создании основной страницы корзины опять проверка нужна будет. Сама проверка состоит в проверке повторений id.

В обработчике так записываю id каждого товара.
session_start();
if (!isset($_SESSION['id'])) {
    $_SESSION['id'] = array();
   
}
array_push($_SESSION['id'], $id);

Кстати, я заметил, что $_SESSION и sessionStorage по разному избавляются от данных. Первое хранилище только по закрытию браузера, а второе по закрытию вкладки. Правильно?


PS Надо тоже об КУКАХ задуматься.

laimas 15.01.2016 06:34

$_SESSION не избавляется от данных, это просто суперглобальный массив. Избавиться от данных в нем, это только выполнить такую операцию. Что касается жизни сессии, то по умолчанию она равна 24 минутам, но это не означает, что именно по истечении этого времени ее не будет, она умрет, да, но сборщик мусора не обязательно удалит ее, он работает по своему алгоритму.

Как поступает браузер с файлом своей не знаю, да это и не важно. Гораздо важнее, что нет смысла использовать сессию на сервере и на клиенте, вы ведь ни в чем не выигрываете в этом случае. Более того, добавление товара, это обязательно хотя бы элементарная проверка его наличия, то есть это запрос сервера, серверу и хранить корзину. А учитывая, что у корзины два представления, и если речь идет о кратком ее представлении, и добавление товаров, это асинхронные запросы, то ответ сервера должен содержать информацию об этом представлении, которое нужно оперативно обновлять на клиенте. Все, больше клиенту ничего не надо.

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

melst 15.01.2016 09:18

Цитата:

Сообщение от laimas (Сообщение 403828)

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

А как быть с данными которые получены асинхронно при обновлении страницы или переходе на другую? Я sessionStorage только для этого использую. Если просто переход без добавления товара , то корзина берется из сессии клиента, если опять добавляется товар, то делается запрос. Как сделать по-другому я пока не знаю. Если только каждый раз запросы делать.

ivt22 15.01.2016 09:23

Цитата:

Сообщение от laimas (Сообщение 403770)
https://learn.javascript.ru/cookie

Но зачем именно куки? Если они устанавливаются только с параметром name, то это будут сессионные куки, которые не будут сохранены браузером после закрытия страницы. С тем же успехом сервер в свою сессию может записать данные корзины и выводить ее на страницах, ведь страницы все равно формирует он.

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

а мне как раз нужно что-то, что сохранялось бы при обновлении страницы и при переходе на другую страницу, что бы я мог таскать список товаров за пользователем, я новичек и книжку по JavaScript только начал читать, а задачу мне срочно нужно как-то решить. Потому что срок пробной версии Битрикса заканчивается через 4 дня и если я не успею клиенту показать рабочий вариант, то он не оплатит Битрикс. И тогда месяц работы коту под хвост. Вот я и прошу помощи, потомучто самостоятельно я никак не успеваю разобраться.

melst 15.01.2016 09:33

Цитата:

Сообщение от ivt22 (Сообщение 403833)
а мне как раз нужно что-то, что сохранялось бы при обновлении страницы и при переходе на другую страницу, что бы я мог таскать список товаров за пользователем, я новичек и книжку по JavaScript только начал читать, а задачу мне срочно нужно как-то решить. Потому что срок пробной версии Битрикса заканчивается через 4 дня и если я не успею клиенту показать рабочий вариант, то он не оплатит Битрикс. И тогда месяц работы коту под хвост. Вот я и прошу помощи, потомучто самостоятельно я никак не успеваю разобраться.

Вот я как раз о том же говорю. Я использую сессию на клиенте, но как я понял можно и каждый раз запрос делать и при нажатии на кнопку, и при обновлении страницы. С помощью sessionStorage у меня работает. Но вот laimas указывает, что это лишнее.

laimas 15.01.2016 11:43

Цитата:

Сообщение от melst
А как быть с данными которые получены асинхронно при обновлении страницы или переходе на другую? Я sessionStorage только для этого использую.

Цитата:

Сообщение от ivt22
а мне как раз нужно что-то, что сохранялось бы при обновлении страницы и при переходе на другую страницу, что бы я мог таскать список товаров за пользователем

Сессия, которую можно стартовать на сервере и использовать посредством супеглобального массива $_SESSION тогда по вашему для чего?

melst,

session_start();
if (!isset($_SESSION['id'])) {
    $_SESSION['id'] = array();
    
}
array_push($_SESSION['id'], $id);


зачем тогда на сервере, если вы еще дублируете это на клиенте в sessionStorage?

Сессия по умолчанию живет 24 минуты, если в течении этого времени будет запрос от клиента, то смерть будет отложена на следующие 24 минуты, и т.д. Другими словами, если корзина хранится в сессии, то никуда она не пропадет при переходах между страницами, и пофигу каким образом данные для корзины получены от клиента, асинхронным запросом или нет. Только добавление товаров в корзину на сервере как изложено выше... ну в общем это не корзина.

sessionStorage будут полезна тогда, когда у клиента будут отключены куки и идентифицировать сессию клиента не получится.

ivt22, я уже писал, что куки можно использовать, и как сессионные, и как действующие установленное время. Только в Битриксе уже есть готовое, что касается продажи, корзины и прочего что с этим связано.

melst 15.01.2016 13:48

Цитата:

Сообщение от laimas (Сообщение 403847)
Только добавление товаров в корзину на сервере как изложено выше... ну в общем это не корзина.

Ну вот... А что есть корзина? Это я привел пример того как записываю каждый id в сессию. Кроме этого, конечно есть и полная выборка из БД. Проверки различные пока не делал. Костяк хочу сначала сотворить.

laimas 15.01.2016 14:07

Цитата:

Сообщение от melst
А что есть корзина?

Корзину, ее код, будет определять в том числе и способ добавления товара: по количеству - либо по одному одного товара, либо можно добавлять несколько одного и того же товара, по групповому/одиночному добавлению - либо можно выбрать группу различных товаров в категории на странице, либо только один товар.

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

Добавление товара в корзину начинается с запроса в базу - существует ли вообще такой товар, и если да, только затем пишется в сессию, в корзину, вернув в запросе цену товара, можно и другие важные характеристики, например наименование и т.п, чтобы по полном отображении корзины не делать более запросов в базу.

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

DynkanMaclaud 15.01.2016 21:09

я написал этот скрипт (но показывать его не буду, ну он уж очень мне не нравится в плане свой поддерживаемости) в localStorage при клике я помещал name продукта... тоесть помещал строку, но сейчас пишу скрипт где будет помещаться обьект но переобразованный в строку через JSON, а из localStorage я читаю его как обьект, это наиного удобнее, так как получаешь сразу набор данных : цена товара и описание, название продукта... Так с данными в localStorage намного легче работать... попробуй сам напиши...

laimas 16.01.2016 01:01

Цитата:

Сообщение от DynkanMaclaud
Так с данными в localStorage намного легче работать...

Не путайте корзину товаров, которую нужно класть в сессию, а не в локальное хранилище, с базой товаров, которую уж никак в локальное хранилище помещать нельзя.

DynkanMaclaud 16.01.2016 11:39

laimas,
Вы в своем примере ориентированны на php и БД, да список товаров на странице нужно получать из БД, но корзину товаров для пользователя можно хранить в локальном хранилище (а почему её там нельзя хранить?))

laimas 16.01.2016 12:33

Цитата:

Сообщение от DynkanMaclaud
корзину товаров для пользователя можно хранить в локальном хранилище (а почему её там нельзя хранить?)

Я писал, что нет смысла хранить товары в сессионном хранилище на клиенте, если есть сессия на сервере, добавление товара и изменение корзины обязательно через запрос сервера делается.

Сессия/сессионное хранилище клиента хорошо для корзины тем, что передумал покупатель, просто ушел, и не останется мусора за ним. Работая же с локальным хранилищем нужно очищать его, все таки не есть хорошо забивать его чем непопадя и кому угодно.

Что касается "с данными в localStorage намного легче работать", это вздор, гораздо проще выглядят операции с корзиной на сервере, а если в смысле доступа к ним, то нет ни каких отличий.

DynkanMaclaud 16.01.2016 13:11

laimas,
возможо тот человек который создал эту тему не знает основ php, ну а тут надо параметры отправить на сервер эти параметры нужно обработать далее закинуть в сесссию и сделать это все через ajax... а может просто легче ему на клиенте все это хранить?)) тут знаний чистого js достаточно будет))))

laimas 16.01.2016 13:23

Товары содержатся на сервере, торгует сервер, контроль торговых операций также осуществляется сервером. Каким боком к этому имеет отношение локальное хранилище не понятно - не будет сервера, значит и все хранилища на клиенте это ноль.

ivt22 18.01.2016 09:42

Цитата:

Сообщение от DynkanMaclaud (Сообщение 403959)
laimas,
возможо тот человек который создал эту тему не знает основ php, ну а тут надо параметры отправить на сервер эти параметры нужно обработать далее закинуть в сесссию и сделать это все через ajax... а может просто легче ему на клиенте все это хранить?)) тут знаний чистого js достаточно будет))))

Как раз на знание PHP не жалуюсь, а вот на JavaScript вообще не знаю, методом тыка редактирую готовые куски кода, просто некогда изучать его, если успеете посмотреть до полного отключения битрикса - вот что я делаю В табличке при клике по любой из строк товар добавляется в корзину, при повторном клике удаляется, если тыкнуть по корзине, то она раскроется почти на весь экран и можно настроить кол-во каждого товара и отправить заявку. Стандартная корзина Битрикса мне не подойдет, потому что, никаких функций оплаты мне не надо, надо только лишь, чтобы список выбранных товаров отправлялся на почту и все, а если использовать корзину Битрикса, то это уже другая редакция, которая тысяч на 10 дороже.


Часовой пояс GMT +3, время: 20:33.