пятница, ноября 07, 2008

"no goback" javascript отключает переход назад

Alexf проводит конкурс:
нужно написать javascript который будет удерживать юзера на сайте, а именно отключать хистори назад, т.е. скрипт будет только отключать возможность уйти с сайта при нажатии бекспейса или кнопки назад, но возможность перехода назад в пределах сайта должна быть.

Не долго думая я написал данный скрип "no goback", проверял в фоксе 3 и опере 9.62.
В firefox'е 3 работает, а вот в opera'е 9.62 нет, в ней почему-то не выполняются javascript'ы при переходе назад, такая вот фича оперы.

Код вставки в HTML:
<html><body><script src="no_goback.js"/></body></html>
Нужно вставлять скрипт именно в тег body


UPD:

переписал скрипт теперь работает в Opera 9.62, IE 6, Firefox 3.
в других браузерах не тестил, если кто сможет потестируйте и дайте знать

теперь для работы скрипта нужно в тег body вашего html вставить iframe:

<html>
<head>
</head>
<body>
<iframe src="frame.html"
style="display:none"
onload="this.contentWindow.no_goback()"></iframe>
</body>
</html>

а вот сам код iframe'a (frame.html):
<html>
<head>
<meta http-equiv="Cache-Control" Content="no-cache">
<meta http-equiv="Pragma" Content="no-cache">
<meta http-equiv="Expires" Content="0">
<meta http-equiv="cache-control" content="no-store">
<script src="no_goback.js"></script>
</head>
<body>
<script>
if (!document.defaultView) {no_goback();}
</script>
</body>
</html>


это код самого javascrip'a (no_back.js):

//
// Author: Jungle
// Homepage: http://seodiver.ru/2008/11/no-goback-javascript.html
//
function createCookie(name,value,days) {
if (days) {
var date = new Date();
date.setTime(date.getTime()+(days*24*60*60*1000));
var expires = "; expires="+date.toGMTString();
}
else var expires = "";
document.cookie = name+"="+value+expires+"; path=/";
}

function readCookie(name) {
var nameEQ = name + "=";
var ca = document.cookie.split(';');
for(var i=0;i < ca.length;i++) {
var c = ca[i];
while (c.charAt(0)==' ') c = c.substring(1,c.length);
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
}
return null;
}

function eraseCookie(name) {
createCookie(name,"",-1);
}


function no_goback(){
var no_goback_flag = readCookie('no_goback');

if (!no_goback_flag) {
if (!top.location.search.match(/[&\?]no_goback$/)) {
createCookie('no_goback', top.location.href);
top.location.search += top.location.search ? '&no_goback' : '?no_goback';
}
} else if (top.location.search.match(/[&\?]no_goback$/)) {
top.location.href = no_goback_flag;
}

}



11 комментариев:

Анонимный комментирует...
Этот комментарий был удален администратором блога.
Анонимный комментирует...

Классно. Но теперь бы еще ты и объяснил для малотямных, как его вставлять?
Создаем файл no_goback.js в корне, туда пихаем скрипт, а в html код пишем как показано?

Или как?

Анонимный комментирует...

Мда уж, вообще нигде не работает, не только в Опере, но и в ФФ и в Осле тоже.

Jungle комментирует...

2tongo ну ты всё правильно понял, заливаем скрипт no_goback.js далее прописываем путь к ниму в хтмлке

2аноним укажи точнее, где именно не работает версия браузеров подскажи, если не сложно

Анонимный комментирует...

Интересное решение, поставил на свой варезник. Что-нибудь планируешь еще разрабатывать?

Jungle комментирует...

Пузат, если есть какие идеи, то возможно, напиши что конкретно тебя интересует.

orthopaedist комментирует...

Здравствуйте. Нужен такой скрипт. Есть сайт из нескольких сотен страниц. Хотелось бы, чтобы на него заходили ТОЛЬКО через первую страницу. Идея скрипта. Если пользователь заходит через первую страницу - то ничего не делать. Если пользователь заходит не через первую страницу, то редиректить его на первую, а затем на ту, с которой он зашел. Редирект можно сделать примерно так
var call = document.referrer.toLowerCase();
var where = call.indexOf("domain_name");
if (where == -1)
window.location.href="first_page";

А вот как его потом вернуть назад? Может чего подскажете? Спасибо

Jungle комментирует...

2orthopaedist
T - главная страница
С - текущая страница

switch (cookie.step) {
case 'main':
cookie.step = 'end';
redirect(C.url.referrer);
break;

default:
if (C.url != T.url){
cookie.step = 'main';
redirect(T.url);
} else {
cookie.step = 'end';
}
}

такой алгоритм, если я вас правильно понял. реализация за вами :)

orthopaedist комментирует...

Спасибо за быстрый ответ. Что-то мне не очень понятно, извините. Не напишете ли подробнее.

Jungle комментирует...

cookie.step - это запись в куки о текущем состоянии/шаге (реализация при помощи 2 функций createCookie и readCookie посмотрите реализацию в данном посте)

состояний может быть 3:
1 неопределенно
2 main
3 end

cookie.step - заменяем на readCookie('step')

cookie.step = 'main' или 'end' заменяем на cookieCreate('step', новое_состояние, кол_дней)

C.url - это document.URL
T.url - задаете вручную урл главной страницы

в примере алгоритма нужно исправить C.url.referrer на C.referrer

C.referrer есть document.referrer


redirect(url) - это есть location = url;

в результате получаем:
var T_URL = адрес_главной_страницы;

switch (readCookie('step')) {
case 'main':
createCookie('step','end');
location = document.referrer;
break;

default:
if (document.URL != T_URL){
createCookie('step', 'main');
location = T_URL;
} else {
createCookie('step', 'end');
}
}

за вами тест, как проверите отпишите удачно или нет прошёл тест :)

orthopaedist комментирует...

Вроде пока понятно. Буду пробовать