Новые уроки по создание броузерной игры – 3 - Движки для разработки игр и сложные системы разработки - Движки для браузерных игр

Новые уроки по создание броузерной игры – 3

Дата: Среда, 30 Июля 2014, 15:01 | Сообщение # 1

30 мл. блоков

Сейчас нет на сайте

Всем привет. Вот и 3 часть подошла к своему началу. В этом уроке мы наконец то начнём пилить пилой код. В данном случае авторизацию и регистрацию.

Графическое оформление базы данных.
Перед тем, как начать, давайте дадим графики базе данных.

Откройте “C:\WebServers\home\”, и создайте в ней новую папку, ну например thebestgame.
Внутри thebestgame создайте папку www, там будут находиться наши файлы.
Внутри www создайте папку sessions, там будут находиться наши игровые сессий.

“Для умных людей:
Почему там будут находиться сессий? Потому что папка с сессиями которую имеет Denwer, не подходит для игры, ведь сессия через 30 минут пропадает.”

Тыц , скачиваем графический интерфрейс для MongoDB. Скачали, откройте архив и залейте папку в “C:\WebServers\thebestgame\www”.
Теперь открываем браузер и переходим по http://thebestgame/rockmongo/index.php или http://вашапапка/rockmongo/index.php

Host: Localhost
Логин: Admin
Пароль: Admin

Последнюю строчку не трогаем, это для тех у кого нет права на админку.
Нажимаем “Войти и отжечь”.

Если же когда вы зашли в БД, у вас в браузере белый экран с ошибкой(не запомнил слова).
Выключаем denwer, открываем cmd и пишем “net stop mongodb”.
Переходим по “C:\WebServers\database”, и удаляем от туда файл mongod.lock.
После этого пишем “net start mongodb”. И включаем denwer. Воуля, заработало.

Авторизируйтесь, в самом вверху нажмите на ссылку “Базы данных”.
У вас появится список всех БД которые у вас есть, в данном случае у вас есть только local.
Нажмите создать новую базу данных, назовите её "thebestgame" или как вам угодно.

Для работы с кодом я рекомендую использовать NodPad++, но если хотите можете работать в блокноте(только потом не обижайтесь что у вас, ошибка с session_start() и какие то корявые символы в начале страницы).

Теперь давайте приступим к коду. Открываем папку “thebestgame” и создаём в ней файл “conf.php”.

В него записываем:
conf.php

Код

<?session_start(); // запускаем сессию
ini_set('session.save_path', $_SERVER['DOCUMENT_ROOT'] .'../sessions/'); //меняем место положение наших сессий(возможно на бесплатных хостингах работать не будет закомементируйте, если что)
ini_set('session.gc_maxlifetime', 120960); //долгая жизнь сессий
$dbhost = 'localhost'; //адрес хоста к mongodb
$dbname = 'thebestgame'; //имя базы данных

//подключение к mongodb
$m = new Mongo("mongodb://$dbhost");
$db = $m->$dbname;

//коллекций из которых делается выборка
$users = $db->users;
?>

С начала идёт функция session_start(); которая инициализирует данные сессии, в дальнейшем они нам пригодятся.

Через ini_set я устанавливаю настройки так что бы все сессий сохранялись у нас в “C:\WebServers\home\thebestgame\sessions\”.

Через следующий ini_set я устанавливаю настройки долговечности сессий.

После этого у нас идёт подключение к базе.

$dbhost – адрес сервера базы данных
$dbname – имя базы данных. Название базы не “thebestgame”, то стоит поменять название на то которое у вас.

После комментариев “Подключение к mongodb” у нас идёт функция подключения к серверу базы данных.

Ну а в конце указываются коллекций в которых делается выборка.
Коллекций – этакая замена таблицам.

После первой записи в БД коллекция users появится самостоятельно.

index.php

Код

<?
include 'conf.php'; //подключаем конфиг
$log_in = $users->findOne(array('login' => $_POST['login'], 'password' => $_POST['password'])); //делаем выборку по логину и паролю
if(isSet($_POST['log-in']) && $log_in && preg_match('/[0-9a-zA-Z]/', $_POST['password']) && preg_match('/[0-9a-zA-Z]/', $_POST['login'])){
$_SESSION['login_player'] = $_POST['login']; //записываем в сессию логин
echo '<script>
document.location.href = "http://25.120.133.229/game.php";
</script>';//и переходим на страницу с игрой
}
?>
<!DOCTYPE html>
<html>
<head>
<title>THE BEST GAME</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<form action="index.php" method="post">
<body>
<input type="text" placeholder="Login" name="login" class="textinputlogin"/>
<input type="password" placeholder="Password" name="password" class="textinputpassword"/>
<input type="submit" value="Войти" name="log-in" class="button"/>
<a href="reg.php" class="reg">Регистрация</a>
</form>
</body>
</html>

Про html я рассказывать не буду, про формы и дизайн вы сами должны всё прекрасно знать.

А вот про php я расскажу.
В начале у нас идёт include, это подключение другого скрипта, html, php, javascript – всё равно подключит. В данном случае подключается conf.php.

$log_in содержит в себе выборку данных из базы по логину и паролю.
Потом идёт уловие:
Если кнопка войти нажата, данные указанные в $log_in есть в базе, в логине и в пароле что-нибудь написано. Тогда заводим сессию с логином и перебрасываем на страницу с игрой.

Данные о логине и пароле передаются из формы(<form>) методом post(<form action=”index.php” method=”post”>), которые берутся из данных введённых пользователем в input login и input password.
Вместо моего 25.120.133.229(мой айпи в хамачи) вы должны поставить название вашей папки “thebestgame” или как-нибудь ещё.

Стили я вам дам без картинок, объяснять по ним ничего не буду, если вы пытались создать браузерные игры, наверняка вы думали что их надо делать на html+css. biggrin

style.css

Код

.textinputlogin{
position: fixed;
top: 40%;
left: 44%
}
.textinputpassword{
position: fixed;
top: 50%;
left: 44%
}
.button{
background: #eee;
position: fixed;
top: 60%;
left: 44%
}
.reg{
position: fixed;
top: 60%;
left: 49%
}
body{
background: #eee;
}

stylereg.css

Код

.textinputlogin{
position: fixed;
top: 20%;
left: 44%
}
.textinputpassword{
position: fixed;
top: 40%;
left: 44%
}
.textinputrepassword{
position: fixed;
top: 50%;
left: 44%
}
.textinputemail{
position: fixed;
top: 30%;
left: 44%
}
.button{
background: #eee;
position: fixed;
top: 60%;
left: 44%
}
body{
background: #eee;
}

Ну и у нас остался последний скрипт на сегодня. smile

reg.php

Код

<?
include 'conf.php'; //подключаем конфиг
if(isSet($_POST['regestration']) && $_POST['password'] == $_POST['repassword'] && preg_match('/[0-9a-zA-Z]/', $_POST['password'] && preg_match('/[0-9a-zA-Z]/', $_POST['login'])){
$users->insert( //запись в бд
array(
'login' => $_POST['login'], //логин пользователя
'password' => $_POST['password'], //пароль пользователя
'email' => $_POST['email'], //эмэйл пользователя
//основные характеристики персонажа
'charaster_class' => 0,
'lvl' => 0,
'xp' => 0,
'hp' => 0,
'mn' => 0,
//второстепенные характеристики персонажа
'strength' => 0,
'speed' => 0,
'intelligence' => 0,
'faith' => 0
));
$_SESSION['login_player'] = $_POST['login'];
echo '<script>
document.location.href = "http://25.120.133.229/charcreater.php";
</script>';//и переходим на страницу с с созданием персонажа
}
?>
<!DOCTYPE html>
<html>
<head>
<title>THE BEST GAME</title>
<link rel="stylesheet" type="text/css" href="stylereg.css">
</head>
<form action="reg.php" method="post">
<body>
<input type="text" placeholder="Login" name="login" class="textinputlogin"/>
<input type="email" placeholder="Email" name="email" class="textinputemail"/>
<input type="password" placeholder="Password" name="password" class="textinputpassword"/>
<input type="password" placeholder="Repeat password" name="repassword" class="textinputrepassword"/>
<input type="submit" value="Зарегистрироваться" name="regestration" class="button"/>
</form>
</body>
</html>

Html код почти такой же, там только изменены имена некоторых объектов, и некоторые объекты типа emai,l или повторения пароля были добавлены.

Перейдём к php.

В начале всё так же, подключён conf.php.

Дальше идёт условие:
Если кнопка зарегистрироваться нажата, пароль равен повторению пароля, и в логине с паролем чего-нибудь написано, тогда делаем запись в БД.

Записываем:
Login, который равен,введённому логину.
Password, который равен введённому паролю.
Email, который равен введённому эмейлу.
Про остальные вы узнаете в следующей части когда мы будем делать редактор персонажа, пока что они все по нулям.

Умникам, которые спросят почему ты не проверяешь что бы в эмейле что то было:
Ответ прост, если не будет написано name@email.com, без “@” и без домена, скрипт просто не пропустит.

Ну и вроде бы как всё.
До встречи, пошёл отдыхать. biggrin

Предупреждение: всё что я написал в зачёркнутом виде является шуткой и никак не пытает обидеть того к кому обращаются.~~(нет)~~

Сообщение отредактировал last2424 - Четверг, 07 Августа 2014, 15:42

liker

Дата: Среда, 30 Июля 2014, 15:24 | Сообщение # 2

почетный гость

Сообщений: 64

Сейчас нет на сайте

Нужно все таки отделять HTML код от PHP кода, потому что это очень засоряет проект sad

А так все ок пока

dima9595

Дата: Среда, 30 Июля 2014, 15:32 | Сообщение # 3

почти ветеран

Сообщений: 831

Сейчас нет на сайте

Цитата last2424 (

)

Умникам, которые спросят почему ты не проверяешь что бы в эмейле что то было:

По сути, проверять email при регистрации не обязательно. Можно отправлять на почту ссылку на подтверждения аккаунта. Если пользователь введёт email не правильно, то и не сможет подтвердить аккаунт, значит, и не сможет играть...я бы так сделал.

Сообщение отредактировал dima9595 - Среда, 30 Июля 2014, 15:33

last2424

Дата: Среда, 30 Июля 2014, 15:35 | Сообщение # 4

30 мл. блоков

Сообщений: 1550

Сейчас нет на сайте

dima9595, это не для таких как ты. А для тех, кто в этом вообще нифига не понимает. biggrin

Цитата

Нужно все таки отделять HTML код от PHP кода, потому что это очень засоряет проект

Буду, буду отделять. smile

Сообщение отредактировал last2424 - Среда, 30 Июля 2014, 15:36

Vinchensoo

Дата: Среда, 30 Июля 2014, 16:23 | Сообщение # 5

Злобный социопат с комплексом Бога

Сообщений: 8943

Сейчас нет на сайте

Цитата last2424 (

)

Почему там будут находиться сессий? Потому что папка с сессиями которую имеет Denwer, не подходит для игры, ведь сессия через 30 минут пропадает.”

Умные люди умеют конфигурировать апач, лол)

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

last2424

Дата: Среда, 30 Июля 2014, 16:31 | Сообщение # 6

30 мл. блоков

Сообщений: 1550

Сейчас нет на сайте

Vinchensoo, все ответы во второй части. biggrin

Мне лень писать, я устал. Я пилил этот урок с 11:00 до 17:00. smile

Folleah

Дата: Среда, 30 Июля 2014, 16:40 | Сообщение # 7

Архитектор

Сообщений: 755

Сейчас нет на сайте

last2424, если знаешь, что делаешь, там работы на час...

last2424

Дата: Среда, 30 Июля 2014, 16:47 | Сообщение # 8

30 мл. блоков

Сообщений: 1550

Сейчас нет на сайте

Folleah, мне нужно подумать, прежде чем написать. Эти раздумья уходят на час-два.

Folleah

Дата: Среда, 30 Июля 2014, 16:52 | Сообщение # 9

Архитектор

Сообщений: 755

Сейчас нет на сайте

last2424, о чем тут думать то? Я пока только авторизацию (?) увидел, а она пишется в несколько строк. У меня на более продвинутую с кучей проверок ушло 10 минут максимум.

Цитата Vinchensoo (

)

Зачем для браузерной игры монга?

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

Vinchensoo

Дата: Среда, 30 Июля 2014, 16:53 | Сообщение # 10

Злобный социопат с комплексом Бога

Сообщений: 8943

Сейчас нет на сайте

Лень - не пиши. Уроки писать нужно нормально. Тебя же никто не заставляет писать их прямо на форум. Работай над уроком 3-4 дня, если не успеваешь за раз или устаешь. Важно закончить мысль и подать все понятно, по полочкам, разжованно для понимания читателей.

Про монгу- просто интересно, я чесс слово не понимаю, зачем в браузерной игре nosql. Подожду вторую часть.

Цитата Folleah (

)

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

Не осознал как связаны монга и асинхронность, если честно

last2424

Дата: Среда, 30 Июля 2014, 16:57 | Сообщение # 11

30 мл. блоков

Сообщений: 1550

Сейчас нет на сайте

Vinchensoo, это уже 3 часть. biggrin

Folleah, блин, раз такой умный иди свои уроки по браузерке пиши а меня не учи, как надо писать, надо думать что бы всё было нормально, а не как курица лапой.
Как ты будешь писать код не думая, что писать?

Сообщение отредактировал last2424 - Среда, 30 Июля 2014, 16:58

Folleah

Дата: Среда, 30 Июля 2014, 17:00 | Сообщение # 12

Архитектор

Сообщений: 755

Сейчас нет на сайте

Цитата Vinchensoo (

)

Не осознал как связаны монга и асинхронность, если честно

Ну, это лишь предположение. Помню я пытался с NodeJS MYSQL связать, в итоге взял монго, только вот не помню почему biggrin

Я вообще не понимаю, зачем на PHP в 2014 году писать браузерку, когда есть более рациональные варианты.

last2424