!!各ページの画面
html、cssで作成。
それぞれサイドバーなどで画面を分割して作った。
!!データベース
mysqlを用いてアカウントの登録に必要なメールアドレスとパスワード、さらにユーザーのプロフィールの要素も追加したテーブルを作成し、ユーザー情報の管理を行っている。
((br))
データベースにidというカラム(要素)も作成し、AUTO_INCREMENT属性を定義することでそれぞれのユーザーに対して、一意のidを付与できる。
((br))
このWwbページではこのidを用いて、誰がログインしているのかを判断したり、他のユーザーを探し出したりしている。
!!ページ遷移
javascriptで関数を作成
ボタンを押す → 関数を呼び出す → 次のページに遷移
((br))
!!パスワード認証システム
ログインページに入力されたメールアドレスとパスワードをもとにしてsql文でデータベースに接続し、select~whereでパスワードを取得する。
((br))
それが入力したものと合っていればメインページに飛ばす。
((br))
間違っていれば再びログインページに戻すようにした。
!!メッセージ
app.js
((br))
このプログラムは、HTTPサーバーとWebSocketサーバーの両方を提供するためのもの
((br))
全体の流れとしては
1.HTTPサーバーを作成し、静的ファイルをクライアントに提供する。
((br))
2.WebSocketを使用して、リアルタイム通信を行う。
((br))
((br))
wschat.js
((br))
このプログラムは、リアルタイムのチャット機能を提供するためのプログラム
((br))
全体の流れとしては
((br))
1.クライアントがサーバーに接続する。
((br))
2.サーバーからメッセージを受信し、それを画面に表示する。
((br))
3.クライアントがメッセージを送信すると、サーバーにそのメッセージを送る。
((br))
style.css
((br))
index.html
((br))
上記2つのプログラムは、かんたんに作成しているため省略
((br))
改善点(実装できなかったところ)
((br))
・チャットルームごとの区別をすることができなかった。
((br))
・メッセージを送信したときに、送信したメッセージが2重に表示されてしまっている。
((br))