Вступление
Вообще этот пост я хотел посвятить самодельной скорострельной пушке Гаусса, но решил порадовать другой, надеюсь, интересной публикацией. Идея чата у меня возникла довольно давно, когда с другом играли в шпионов. Понадобилось, как не трудно догадаться, секретное ПО — в первую очередь чат. Сейчас особого смысла создания собственной системы общения нет, т.к. существуют удобные в использовании социальные сети. Но всегда интересно было интересно собрать собственный прибор обмена информацией, например радио, и отправлять простые сообщения: «Прием. Как слышно?», «Я же тебе говорил, Вася, что это круто» и т.д. Мы пойдем более простым и напишем программу на as2 в среде разработки flash-приложений Adobe Flash Professional CS6. Я также заметил, что в интернете довольно мало информации на русском языке про возможности общения as2 с php.
План работы
- Определить структуру
- Понять, как работает система и её основные функции
- Нарисовать интерфейс клиента
- Написать программу для клиента
- Описать оборот сообщениями на php
Теория
Структура
Все собственно состоит из двух составляющих.
- Клиентская часть — это flash-приложение выполняющее отправку сообщений на сервер и прием чужих сообщений с сервера
- Серверная часть — это php-скрипт лежащий на удаленном сервере способный принимать сообщения от клиента и отправлять другим клиентам, выполняющим подключение к серверу
Что делать, и как это работает
А теперь подойдем более плотно к объяснению работы системы. Есть клиент, у него есть окно сообщений, окна для ввода сообщения и никнейма и есть кнопочка «Отправить». Человек указывает свой никнейм (например даже: «Твоя смерть», «Нагибатор» и т.п.), вводит сообщение и отправляет его. Его сообщение отправляется по протоколу ‘POST’ на сервер и запускается скрипт php, который проверяет, что этот запрос на получение обновления или запись нового сообщения, если второе, то записывает его в текстовый файл на сервере и останавливается. Каждый клиент, чтобы получить свое сообщение или другие сообщения, отправляет запрос на сервер с пустой переменной текста отправляемого сообщения — так php скрипт (причем тот же, что и записывает сообщения) определяет, что это запрос на обновление (получения новых сообщений). При обновлении в любом случае будет отправляться сообщение записанное в текстовый файл, ведь очень сложно определять, какой клиент уже получил сообщение, а какой еще нет, это делается в клиенте путем сравнения с последним пришедшем сообщением.
Практика
Интерфейс клиента
Для примера зададим размер окна 800×600 и черный цвет фона. Для элементов интерфейса используется шрифт Virtual DJ. Рисовать интерфейс мы будем на слое Menu.
Как я говорил ранее у нас есть некоторые элементы интерфейса:
- поле всех сообщений
- поле ввода сообщения
- поле ввода никнейма
- кнопка для отправки сообщения
Поле всех сообщений — это динамический текст с именем экземпляра «ChatBox». Поле ввода сообщения — это вводимый текст с именем экземпляра «vvod». Поле ввода никнейма — вводимый текст с именем экземпляра «nick». Кнопка отправки — мувиклип с типом ‘Button’ и именем экземпляра «Sender».
Написание кода для клиента
Теперь цветочки закончились, нам осталось сделать самое главное — написать программу. Создадим новый слой «actions» и заблокируем его, чтобы случайно на нем ничего не нарисовать.
Для начала немного мелочей, остановим воспроизведение на этом кадре и обнулим текст.
stop(); vvod.text = ""; ChatBox.text = "";
Первоначальные переменные: одна хранит ссылку на php скрипт и несколько переменных, которые нам понадобятся позднее. Кстати я использую хостинг Hostinger(не реклама, мне не платят).
strUrl = "http://keyserver2.esy.es/Chat.php"; specstr = ""; lastmess = "";
Теперь нам нужен контейнер типа LoadVars, он тут главный актер, именно с помощью этого контейнера выполняется отправка и получение данных. Создадим его myLoadVars. Теперь функция, которая отвечает за прием и запись в ChatBox сообщений. Для удобной работы записываем текст сообщения сразу через перенос строки ("\n") в переменную specstr и сравниваем с предыдущем сообщением. Если они не совпадают, то отформатированное (перенос строки) сообщение записывается в ChatBox.
var myLoadVars:LoadVars = new LoadVars(); myLoadVars.onLoad = function(success:Boolean) { specstr = "\n" + myLoadVars.mess; if(specstr != lastmess) { lastmess = specstr; ChatBox.text += specstr; } };
Дальше опишем отправку сообщения по нажатии на кнопку (sender). Для начала в контейнере myLoadVars запишем в переменную vvod_name наш ник (nick) и текст сообщения (vvod) и очищаем текст в поле ввода сообщения (vvod). Затем отправляем данные контейнера (myLoadVars) на сервер по протоколу ‘POST’.
sender.onRelease = function() { myLoadVars.vvod_name = nick.text + ": " + vvod.text; vvod.text = ""; myLoadVars.sendAndLoad(strUrl, myLoadVars, "POST"); };
Теперь последнее в клиентской части — это обновления (получения новых сообщений). Наши обновления будут происходить с интервалом в одну тысячу миллисекунд (одна секунда). Все это происходит в переменной «timerT». Внутри функции setInterval пропишем обнуление vvod_name в контейнере myLoadVars, если внимательно читали, то поймете, что это. Потом просто отправляем данные контейнера (myLoadVars) на сервер по протоколу ‘POST’.
var timerT = setInterval(function(){ myLoadVars.vvod_name = ""; myLoadVars.sendAndLoad(strUrl, myLoadVars, "POST");}, 1000);
Написание серверного скрипта
Финальная часть, успокойтесь, тут немного. Мы создаем переменную vvod, данные которой получаем из переменной vvod_name присланной по протоколу ‘POST’. Затем мы определяем запрос на обновление ли это или на запись сообщения. Если второе, то открываем текстовый файл «chatmess.txt» и записываем в него пришедшее сообщение (vvod). Затем с помощью функции echo отправляем обратно записанное сообщение независимо от типа запроса. Поэтому клиент, отправивший сообщение, получает его сразу после отправки без ожидания интервалов обновлений.
<?php $vvod = $_POST['vvod_name']; if ($vvod != ""){ $f = fopen("chatmess.txt", "w"); fwrite($f, $vvod); fclose($f); echo 'mess='.file_get_contents("chatmess.txt"); ?>
Весь код
Для ленивых весь код в целом. Но прошу, если хотите его изменить, прочтите информацию выше, и вы все поймете.
stop(); vvod.text = ""; ChatBox.text = ""; strUrl = "http://keyserver2.esy.es/Chat.php"; specstr = ""; lastmess = ""; var myLoadVars:LoadVars = new LoadVars(); myLoadVars.onLoad = function(success:Boolean) { specstr = "\n" + myLoadVars.mess; if(specstr != lastmess) { lastmess = specstr; ChatBox.text += specstr; } }; sender.onRelease = function() { myLoadVars.vvod_name = nick.text + ": " + vvod.text; vvod.text = ""; myLoadVars.sendAndLoad(strUrl, myLoadVars, "POST"); }; var timerT = setInterval(function(){ myLoadVars.vvod_name = ""; myLoadVars.sendAndLoad(strUrl, myLoadVars, "POST");}, 1000);
<?php $vvod = $_POST['vvod_name']; if ($vvod != ""){ $f = fopen("chatmess.txt", "w"); fwrite($f, $vvod); fclose($f); echo 'mess='.file_get_contents("chatmess.txt"); ?>
Заключение
Можете откинуться на спинку кресла (я не виноват, если у вас табуретка) и поаплодировать себе, вы восхитительны! Я очень рад, что вы дочитали до конца эту статью. Я считаю, что это очень полезный опыт в вашей копилке знаний. Удачи вам в последующем вашем познании удивительной среды разработки Adobe Flash.
Ссылки
Если возникли вопросы
- Пишите в комментарии к публикации
- Пишите в лс на Хабрахабре
- Пишите в лс во Вконтакте
Пожалуйста, ответьте на вопросы ниже! Результаты опроса и небольшой анализ будет в следующей публикации.
ссылка на оригинал статьи http://habrahabr.ru/post/262729/
Добавить комментарий