Проверьте, существует ли файл cookie и хранится ли информация

Я новичок в Javascript/Ajax и пытаюсь сохранить имя пользователя с помощью файлов cookie. У меня есть форма, и я хочу запомнить имя человека (id = firstName). Если они уже заполнили его в прошлом, я хочу отобразить его/ее имя в элементе span при следующем посещении страницы.

Это то, что я хотел бы сделать, используя псевдокод. надеюсь понятно....

Если файл cookie (называемое имя) существует, отобразите эту информацию в элементе тега «span».

еще

Сохраните этот файл cookie, когда пользователь заполняет форму

(У меня есть ввод с type="submit" в качестве кнопки, если это имеет значение)


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

function setCookie(cname, cvalue, milliseconds) {
    var d = new Date();
    d.setTime(d.getTime() + (milliseconds));
    var expires = "expires=" + d.toGMTString();
    document.cookie = cname + "=" + cvalue + "; " + expires;
}
function getCookie(cname) {
    var name = cname + "=";
    var ca = document.cookie.split(';');
    for (var i = 0; i < ca.length; i++) {
        var c = ca[i].trim();
        if (c.indexOf(name) == 0) return c.substring(name.length, c.length);
    }
    return "";
}

document.onload = checkIfCookieExists;
function checkIfCookieExists(){
var firstNameFromCookie = getCookie('firstName');
if(firstNameFromCookie == ''){
   // cookie wasnt set

}
else{
   // cookie was set
   var display = document.getElementsByTagName('span');
   display.innerHTML = firstNameFromCookie;
}
}

function init(){
 var firstName = document.getElementById('firstName');
 var cookieExpieryTimeInMilliseconds = 1000 * 60 * 60; //1000 milliseconds * 60 seconds * 60 minutes - results in 1 hour time.
 setCookie('firstName',firstName ,cookieExpieryTimeInMilliseconds );
}

window.onload = init();

person Joseph Montecalvo    schedule 20.03.2014    source источник
comment
вы также можете использовать localStorage.   -  person Suman Bogati    schedule 20.03.2014
comment
К сожалению, мне нужен код на стороне сервера. Если я не ошибаюсь, localstorage больше клиентская сторона.   -  person Joseph Montecalvo    schedule 20.03.2014
comment
Файлы cookie на стороне клиента Javascript доступны только на стороне клиента.   -  person fzzle    schedule 20.03.2014
comment
Если это необходимо на стороне сервера, лучше использовать файл cookie.   -  person Suman Bogati    schedule 20.03.2014
comment
@fzzle, язык на стороне сервера (например: - php) может считывать значение, установленное файлом cookie javascript.   -  person Suman Bogati    schedule 20.03.2014
comment
@ fzzle неправильно, куки тоже могут быть серверными. @Joseph Montecalvo javascript не является серверным, однако, если вы хотите, чтобы он был серверным, укажите, какой язык вы используете (php/asp/jsp/независимо)   -  person Banana    schedule 20.03.2014
comment
@Banana и -SumanBogati Javascript помечен.   -  person fzzle    schedule 20.03.2014
comment
@fzzle куки вашего предыдущего комментария - это только клиентская сторона, в которой не было ссылки на javascript, вот на что я ответил. но теперь вы правы, javascript - только на стороне клиента, поэтому обработка файлов cookie с javascript будет только на клиентской машине.   -  person Banana    schedule 20.03.2014
comment
@Banana Я использую Ajax   -  person Joseph Montecalvo    schedule 20.03.2014
comment
@Banana Когда вопрос касается Javascript, я предполагаю, что это то, что мы обсуждаем.   -  person fzzle    schedule 20.03.2014
comment
извините за неясность. Я использую Javascript и Ajax   -  person Joseph Montecalvo    schedule 20.03.2014
comment
@JosephMontecalvo Javascript был помечен - это должно быть ясно.   -  person fzzle    schedule 20.03.2014


Ответы (2)


Чтобы прочитать файлы cookie, вы можете использовать встроенную функцию zeus.getCookie() Zeus.js.
zeus.getCookie() работает так:

  • Все файлы cookie объединены в одну строку, document.cookie
  • zeus.getCookie() выбирает нужный ключ из строки
  • Возвращается строка.

Например, если вы установили файл cookie document.cookie = "like=trains", вы можете использовать zeus.getCookie("like") для возврата значения trains (в виде строки).

Чтобы использовать Zeus.js, просто введите

<script src="https://rawgithub.com/thetakeaway/zeus.js/master/zeus.js"></script>

in <head></head>.

Ваше здоровье!

person jczimm    schedule 20.03.2014

используйте их для обработки файлов cookie. просто getCookie с нужным именем и посмотрите, получите ли вы пустое значение.

сторона клиента:

function setCookie(cname, cvalue, milliseconds) {
        var d = new Date();
        d.setTime(d.getTime() + (milliseconds));
        var expires = "expires=" + d.toGMTString();
        document.cookie = cname + "=" + cvalue + "; " + expires;
    }
function getCookie(cname) {
        var name = cname + "=";
        var ca = document.cookie.split(';');
        for (var i = 0; i < ca.length; i++) {
            var c = ca[i].trim();
            if (c.indexOf(name) == 0) return c.substring(name.length, c.length);
        }
        return "";
    }

РЕДАКТИРОВАТЬ:

document.onload = checkIfCookieExists;
function checkIfCookieExists(){
    var firstNameFromCookie = getCookie('first_name');
    if(firstNameFromCookie == ''){
       // cookie wasnt set

    }
    else{
       // cookie was set
       var yourSpan = document.getElementById('yourSpansID');
       yourSpan.innerHTML = firstNameFromCookie;
    }
}

для того, чтобы сохранить куки с помощью вышеперечисленных функций, вы просто делаете это:

function whatever_Function_You_Use_To_Submit_Users_Details(){
     var firstName = ... whatever you do to retrieve first name after user inserted in
     var cookieExpieryTimeInMilliseconds = 1000 * 60 * 60; //1000 milliseconds * 60 seconds * 60 minutes - results in 1 hour time.
     setCookie('first_name',firstName ,cookieExpieryTimeInMilliseconds );
}
person Banana    schedule 20.03.2014
comment
За последние пару дней я провел много исследований с файлами cookie, и мой вопрос всегда заключался в том, когда я рассматривал примеры, где вы вызываете id=firstName. Как отобразить все, что пользователь вводит во входной идентификатор firstName в моем элементе span. - person Joseph Montecalvo; 20.03.2014
comment
вы должны вызвать его в document.onload, когда страница загружается, вы проверяете, существует ли файл cookie, если да, вы просто вставляете полученное значение в свой диапазон, если нет, то вы этого не делаете. я обновлю свой ответ через секунду; - person Banana; 20.03.2014
comment
Хорошо, я попробую реализовать это в своем коде и посмотрю, что произойдет. Единственные проблемы, которые у меня есть, это действительно понять концепцию. я скоро к вам вернусь - person Joseph Montecalvo; 20.03.2014
comment
Конечно. если вам нужна дополнительная помощь в отношении кода, пожалуйста, дайте мне знать. - person Banana; 20.03.2014