2024 ソフトウェア設計及び演習用の班Wiki

html、cssで作成。 画像を挿入して作った。

ログインページに入力されたメールアドレスとパスワードをもとにしてsql文でデータベースに接続し、select~whereでパスワードを取得する。
それが入力したものと合っていればメインページに飛ばす。
間違っていれば再びログインページに戻すようにした。

入力した情報をもとにmqsqlを操作しINSERT文を用いてデータベースにユーザー情報を追加。その際、AUTOINAUTO_INCREMENT属性でそれぞれのユーザーに対して、一意のidを付与している。

ログイン処理のときに自分のmbtiを一緒に持ってくる。
if,elseifで場合分けを行い、自分のmbtiと相性のいい人のみの情報をデータベースから関数selectを用い、持ってくる。
関数fetchallでの出力を関数foreachで持ってきた情報の個数分だけ繰り返した。

mysqlを用いてアカウントの登録に必要なメールアドレスとパスワード、さらにユーザーのプロフィールの要素も追加したテーブルを作成し、ユーザー情報の管理を行っている。

htmlの「次へ」ボタンを押したときに,data-urlという変数を使って外部のredirectpage.jsというJavaScript内の関数を呼び出して次のページに遷移させている。ページ遷移の際にURLパラメータにuseridを加え、これを用いて誰がログインしているのかを判断したり、他のユーザーを探し出したりしている。

app.js
このプログラムは、HTTPサーバーとWebSocketサーバーの両方を提供するためのもの
全体の流れとしては 1.HTTPサーバーを作成し、静的ファイルをクライアントに提供する。
2.WebSocketを使用して、リアルタイム通信を行う。

wschat.js
このプログラムは、リアルタイムのチャット機能を提供するためのプログラム
全体の流れとしては
1.クライアントがサーバーに接続する。
2.サーバーからメッセージを受信し、それを画面に表示する。
3.クライアントがメッセージを送信すると、サーバーにそのメッセージを送る。
style.css
index.html
上記2つのプログラムは、かんたんに作成しているため省略

改善点（実装できなかったところ)
・チャットルームごとの区別をすることができなかった。
・メッセージを送信した際にsocket-idを識別idとして与えてみたが判定されず、送信したメッセージが2重に表示されてしまっている。

サイドバーから相互いいねのページから他のページへの遷移 data-urlという変数を利用し、redirect_page.jsの中の外部の関数を呼び出すことでページ遷移を行えるようにした。urlパラメータを取得し、useridとして扱うことで、情報を保持したままページの遷移を行えるようにした。いいね機能、相互いいね機能は、データベースにアクセスし、データを配列で保存しようと試みたが、実装することができなかった。