PHPで敷居の高い掲示板を作ってみた ～概要編～

はじめに

　どうもお久しぶりです。9月はげろが出るほど忙しく、10月はそこそこに忙しくて、記事が投稿できなかったです。今回はバイトで作っている成果物（？）っぽい物について、どんなもの？とか、どうやって作った？とかについて書いていきます。
　動機としては、自分の中の整理と、再来年以降の引継ぎの為に書きます。また、学生の書いている事（プロじゃない）なので、完ぺきなアプリケーションではないですし、セキュリティ的にも完全ではありません。なので、ガチガチのプロ向けの記事じゃないです。PHPとHTMLが何となく分かっていて、「何かつくりたいなぁ～」と思っている人向けです。
　また、今回は概要編なので、ざっくりアプリの全体像を書いていこうと思います。
※もし参考にする場合は自己責任でお願いします。

この記事の目的

• PHPを用いた新たな（？）掲示板の提案（もしかしたら既に、類似のものがあるかも）
• 自分の学習・作成過程の記録。

「敷居の高い掲示板」で目指した事

今回の「敷居の高い掲示板」では、何を目指して作ったのかというと、

• 学生の本の感想を集めたい
• 2ch的な気軽さ
• 投稿・閲覧は精査して行いたい
• アカウント作るとか面倒

といった要望を満たすことを目指していました。つまり、本の感想を気軽に投稿できるサイトでありつつ、投稿や閲覧にはある程度の精査を行いたい。という事です。アナログな例えで言うと、

「本の感想を、図書館カウンターで集めて、その中で良い物を掲示する」

ですね。これをサイトでやろうって訳です。

必要知識

　「とにかく早く作ろう」と、ゼロからの学習をしながら作ったので、必要最低限の知識です。以下の項目は理解できないと、実際に作れるまでにならないと思います。

• Apache + sendmail (過去に書いた記事を参考)
• Apacheの設定ファイルがいじれる
• PHP(関数が書ける程度)
• HTTP(GET・POST・COOKIE・SESSION)※
• HTML（特にフォームの作り方）

※以下の記事を勉強させていただきました。
・[PHP] リクエストパラメータ・セッションに関するまとめ
・【PHP超入門】HTTP（GET・POST）について

開発環境

　開発に用いた言語やツールは以下の通りです。開発環境はWindows8.1で、Xamppでサーバーを立ち上げていました。

• git&github
• PHP7ぐらい
• HTML

Webアプリケーションの概要

アプリケーション名：「ひとことすいせん」
学生・教授どうしで、図書館の本の感想を言い合う掲示板です。

主な機能

ユーザ関連

• 記事の投稿（アカウント登録なし、メールで認証）
• 投稿した内容の編集
• 閲覧（一部）

管理者側

• 投稿内容の一覧（全て）
• 初期投稿時の公開状態の設定権（公開・非公開・承認待ち）
• 投稿された内容の公開状態の設定権（公開・非公開）
• 閲覧ページの設定権（公開・非公開）

各機能の詳細&デモ

記事を投稿する機能

　記事が投稿されるまでの流れは、以下の図のようになっています。かいつまんで言うと、以下の3つのステップを踏んでいます。

1. ユーザーが投稿画面で（自分の）メールアドレスを入力
2. メールにtoken付のURLが送られる
3. そのURLを踏んで投稿開始

• デモ

さっきの図の番号に対応する様子をスクショしました。
①ユーザーが投稿画面でメールアドレスを入力

②token付のURLが送られる（赤い塗りつぶしは、管理者用メールアドレスです）

③URLをクリックすると、投稿画面に行きます。そしてなんやかんや入力すると。。。

④プレビューが表示されて、

⑤入力内容が投稿されます。と同時に”コメントID”なるものを発行します。

⑥そして、URLが無効かされます。

記事を閲覧する機能

　上記した感じで、ユーザーがテキストベースの内容を入力します。ということは、HTMLの入力フォームからサーバーへ入力情報が送信された、ってことですね。（POSTで送ってます）
しかし、その内容には個人情報が含まれます。例えば、学籍番号とか、氏名、所属するクラスとかですね。それらは公開したくないわけです。なので、↓図のようにapacheで公開されてない領域にすべての情報を保存します。今回は、テキストファイル形式すべての情報を保管するようにしました。

　そうする事によって、入力された情報が守られるわけです。原理的には、apacheというサーバーソフトが仲介人となって、渡してよいファイル・非公開なファイルを判別しているわけです。

ちなみに、アクセス不可能な領域にアクセス（URLで指定）すると、こんな感じでエラーページが返ってきて、内容が確認できないようになっています。

　という事なんですが、「それじゃ投稿した内容が見れないじゃないか！」ってツッコむと思うんですが、そこら辺の処理はPHPに任せています。図（↓）で表すとこんな感じですね、投稿内容が閲覧されるまでの手順としては、

１、ユーザーから閲覧ページ（PHP）が要求される。
２、PHPにより、サーバー内の”公開してもよい情報”のみを取り出す。
３、公開してもよい情報を、HTMLにしてユーザーに返す。

てな感じです。

• デモ

　そんなわけで、実際に閲覧ページに行くと、こんな感じで投稿内容が確認できます。サーバー上には個人情報がありますが、閲覧ページからのアクセスでは、それらの情報を取得することができないようになってます。

記事を編集する機能

　ちらっと”コメントID”って言ってましたけど、これは、投稿内容につき１つ発行されるtokenの事です。これを知っているのは投稿した本人（と管理者）のみなので、これを使ってコメントの編集を行うようにします。

　仕組みとしては↓のようになっていて、正しいコメントIDが入力されたら、対応するコメントの修正作業ができるって感じです。

• デモ

①正しいコメントIDを入力すると、

②対応するコメントが表れて、

③なんやかんや編集して、

③それをプレビューして、

④投稿内容を確認すると、編集がされているのがわかりますね。

記事を管理する機能

　実装した機能の最後として、管理画面があります。説明に入る前に、コメントの状態について断っておきます。コメントの状態は「公開状態」・「非公開状態」・「承認待ち状態」の３つあるとします。公開状態ではコメントが閲覧可能で、非公開・承認待ち状態ではコメントの内容が見れないようになっています。

そして、管理画面では以下の事が可能となっています。

１、コメント投稿時（初期値）の状態を設定できる。
２、投稿済みのコメントの状態を変更できる。
３、各画面自体の公開・非公開が変更できる（メンテナンス等のため）。

１と２の機能によって、コメントの内容が勝手に公開されない設定が可能になるのです。これで、このサイトの秩序が管理できるはず！という狙いです。例えば、初期状態を「承認待ち」にしておいて、管理者が投稿内容を確認して、問題なければ「公開状態」に変更する、みたいな事が可能になっています。

また、３については、サイトのメンテナンス時とかに、不用意にアクセスされないための設定ができます。いつでも変更できて、もし閲覧ページが非公開にされると、↓のようになります。

管理者ログイン方法

　最後に、管理者の管理画面のログイン方法ですね。これに関しては、下のように２段階認証？的なことをしています。流れとしては、

１、管理ログイン画面にてusernameとpasswordを入力。
２、正解だったら、”管理者用メールアドレス”に管理ログイン画面（２回目）を表示。
３、管理ログイン画面（２回目）にて、再度usernameとpasswordを入力。

となっています。ログインできる条件としては、”管理者用メールアドレスを持っている”ことと、”username&passwordを知っている”事になります。これによって、比較的安全にログインしよう！とのことです。また、管理ログイン画面（２回目）というのは、Token付きのURLの事で、１の時にTokenを発行して、メールに送られたURLのTokenと同じだったら２回目のログイン画面を表示する仕組みになっています。

おわりに

　以上が、私の作った”敷居の高い掲示板”です。今回は概要なので、ざっくりとした設計の方針みたいなものをつらつらを書いてみました。今後は、これらの機能を具体的にどう実装するか？みたいな事を書いていけたらなと思います。
　皆さんのPHPの創作意欲の足しになってくれたらうれしいです。それでは！