07 ソーシャルブックマーク(2)

PHP講座(7)!ソーシャルブックマークを作ろう(2)

ソーシャルブックマークアプリケーションの第二回目です。これまでデータベースのCRUDについて何度か復習しましたが、いよいよサイト全体のデータを定義していきます。また、ログイン機能も実装します。

「ぺちぱブックマーク」の要件

10.4.18 (C) 株式会社破滅派

2

1.  登録したユーザーのみ利用できる（＝ユーザーの新規登録がある） 2.  ユーザーは退会できる。 3.  ブックマークしたURLは集計される 4.  ブックマークしたURLにはタグをつけることができる 5.  タグは新規登録ができる。 6.  タグがすでに登録されている場合は同じものを使う。

これらの条件から必要なサイト構造を考えていきます。重要な作業です。

Webサービスを作るときのコツ


3

カオス理論を知っていますか？北京で蝶が羽ばたくと、ニューヨークで台風が起きるそうです。

要するに、簡単なことでも複数組み合せると、複雑になってきます。あとあと面倒になりそうなことをはじめにつぶしておきます。そのためには…

1.  サイトの目的を知る 2.  サイトの内部的な構造を把握する 3.  サイトの視覚的な構造を把握する

サイトの目的を知る


4

ユーザーにとって、みなさんがFlashが得意だとか、jQueryができるとか、ユーザービリティを考えているとか、そうしたことはすべてどうでもいいことです。なぜなら、ユーザーは皆さんのお友達ではないからです。

クライアントにとって、みなさんが何をしたいかはどうでもいいことです。自分達のために何をしてくれるかだけが重要です。なぜなら、クライアントは皆さんのお友達ではないからです。

いま、自分達がやらなければいけないことは何かをしっかり理解してください。

ぺちぱブックマークのためにやらなければいけないことは何ですか？はじめに鉛筆で書き出しましょう。

サイトの内部的な構造を知る


5

Webアプリケーションは目に見えるものがすべてではありません。構造を把握する必要があります。

サイトの構造を頭だけで理解するのはとても難しいです。できるだけ可視化して、整理しながら考える必要があります。

鉛筆＋大きめのノートにどんどん書き出していきましょう。 ※図を作成ツールもありますが、ツールに溺れないように！

理解を助ける図として有名なものにはユースケース図やシーケンス図などがあり、UMLという記法もあります（Google it!）が、はじめはフローチャートで書ければ十分です。

サイトの構造が把握できたら、サイトマップとデータベースの構造を作成します。

シーケンス図

ユースケース図

データベース構造

サイトの視覚的な構造を知る


6

通常はワイヤーフレームを作成します。デザイナーの経験しかない人が犯しがちですが、PHPなどのプログラムを含んだサイトを作成する場合、ワイヤーフレームはURLの数だけ作ればいいという物ではありません。

「サイトの内部的な構造」を理解した上で「画面の状態」を考えて作成する必要があります。

同じトップページでも、「ログイン前」と「ログイン後」では表示される要素が変わります。

PowerPointやOmnigraffle、Visioなどで画面を作成します。

はじめはおおざっぱなものを作り、徐々に細かくしていきます。

「ぺちぱブックマーク」のテーブル構造


7

ID mail password created

1 [email protected] mememna 1990-‐05-‐05 14:00:00

2 [email protected] saQejkh 1975-‐08-‐22 22:02:00

3 [email protected] auifsheoifajos 1960-‐12-‐11 00:00:00

ID user_id url created

1 12 http://example.jp 1990-‐05-‐05 14:00:00

2 14 http://example.com 1975-‐08-‐22 22:02:00

3 16 http://example.jp 1960-‐12-‐11 00:00:00

ID user_id tag_id bookmark_id

1 1 2 1

2 4 5 1

3 1 6 4

ID user_id name created

1 1 これはすごい 1990-‐05-‐05 14:00:00

2 4 php 1975-‐08-‐22 22:02:00

3 1 pear 1960-‐12-‐11 00:00:00

ユーザーテーブル pb_users

ブックマークテーブル pb_bookmarks

タグテーブル pb_tags

データ紐付け用テーブル pb_relationships

※テーブル名には接頭辞をつけましょう。普通はプロジェクト名＋アンダースコアです。

1.ユーザー情報の管理


8

ID mail password created 1 [email protected] mememna 1990-‐05-‐05 14:00:00 2 [email protected] saQejkh 1975-‐08-‐22 22:02:00 3 [email protected] auifsheoifajos 1960-‐12-‐11 00:00:00

主キーと呼ばれるその行を特定するフィールドは、一般的に以下の属性を持ちます。 PRIMARY KEY（主キー） AUTO_INCREMENT（自動増加）

パスワードを格納するときパスワードをデータベースに格納するとき、通常はハッシュ（不可逆的暗号化）して格納します。パスワードをそのまま入れてしまうと、データベースが流出したときにパスワードそのものが流出してしまいます。

1.  登録したユーザーのみ利用できる（＝ユーザーの新規登録がある） 2.  ユーザーは退会できる。

ユーザーのログイン名にはメールアドレスを使います。

2.ブックマーク情報の管理


9

ID user_id url created 1 12 http://example.jp 1990-‐05-‐05 14:00:00 2 14 http://example.com 1975-‐08-‐22 22:02:00 3 16 http://example.jp 1960-‐12-‐11 00:00:00


1.  ユーザーはブックマークを登録できる（暗黙の前提）

ユーザーのIDを登録しておくことで、後で検索に利用できます。

3.タグ情報の管理


10

ID user_id name created 1 1 これはすごい 1990-‐05-‐05 14:00:00 2 4 php 1975-‐08-‐22 22:02:00 3 1 pear 1960-‐12-‐11 00:00:00


1.  タグは新規登録ができる。 2.  タグがすでに登録されている場合は同じものを使う。

ブックマークと同じ原理です。

4.タグとブックマークの紐付け


11

ID user_id tag_id bookmark_id 1 1 2 1 2 4 5 1 3 1 6 4


1.  ブックマークしたURLにはタグをつけることができる

この3つのフィールドを入れることで、「誰がどのブックマークになんというタグをつけたのか」がわかります。

手を動かす前に


12

よし、やっと準備ができたぞ！作ろう！

と、なる前に…

あらかじめ繰り返しが起きそうな部分を定義しておきます。同じことを何度も書くのは馬鹿げています。

• データベースへの接続情報 • URL • ファイルパス

設定ファイル(bootstrap.php)を作成し、すべてのプログラムでこれをインクルードするようにします。

関数による再利用


13

ぺちぱブックマークのように複雑なサービスでは、似たような処理が何度も出てきます。

自分で関数を作ってfunctions.phpに記述し、同じ処理を書かないで済むようにします。

URLが正しい値かどうかチェックして、データベースに接続して… 似たような処理が多いな… これを一々コピペするのは面倒だから、一つのファイルにまとめておこう。

関数の文法


14

function hoge($foo, $bar…){ //ここでなんか処理を行う return $fuga;

}

引数。なくてもいいし、なんこあってもいい。関数名関数宣言

戻り値（なくてもいい）

一度作った関数は何度でも呼び出すことができます。

定義済み関数


15

PHPには定義済みの関数がたくさん（4000ぐらい）あります。人間が考えることは大体同じなので、基本的なものはほとんど揃っています。

1.  文字列の数を数えたい 2.  配列を並べ替えたい 3.  ファイルをコピーしたい 4.  画像を白黒にしたい 5.  メールを送りたい

まずは「こういう関数はないかな？」と探してみることから始めましょう。

ログイン機能の概要


16

1.  ログイン情報（アカウント＋パスワード）の組み合わせが合っていることを確認する機能 →　すぐ作れる

2.  ページAにいた人がページBにきた人と同じだと証明する機能 →　どうやってやるの？

Q. ログイン機能を実装するために必要な2つの機能とは?

ログインフォームで正しい値を入力したAさん

別のページに移動したあと、認証を通ったユーザーなのか判別する

今ページを見ているのはログイン済みのAさんだな！

ログイン＝セッションの利用


17

【セッションとは？】　ユーザーがサイトを訪れて取る一連のページ移動を「セッション」と呼びます。 PHPはこのセッションの間、変数$_SESSION（セッション変数）に情報を記憶することができます。セッションを使わない場合は誰がきても同じ結果を表示

セッションを使えば、ユーザーの情報に応じて処理を変えられる

ex.amazon.co.jp

セッションの利用の仕方


18

【注意点】 session_start()関数はブラウザに何かを表示する前に行うようにしてください。ブラウザに出力が行われたあとにsession_startを行うと、エラーが出ます。

セッションの設定はphpの設定ファイルのphp.iniに書かれています。有効期限などはこの設定次第で変更できないことがあります。

<?php //セッション開始 session_start(); //これ以降、セッション変数が使える if(isset($_SESSION[“login”])){ $user = $_SESSION[“uid”]; }else{ $user = “guest”; }

?>

【よく使うセッション関数】

session_start() セッションの利用を開始する

session_destroy() セッション変数を空にする（ログアウトのときなどに使う）

session_cache_expire($limit) セッションの有効期限を設定する（デフォルトはブラウザを閉じるまで）

セッションを利用したログインのアルゴリズム


19

【ぺちぱブックマークにログイン機能を実装する】

1.  すべてのページでセッション関数を開始（@bootstrap.php）

2.  ログインページでユーザー名とパスワードをチェック

3.  あっていたらセッション変数にログイン情報を書き込み

4.  ログアウトページでセッションを破棄する

セッションの仕組み


20

1.セッション開始時

セッション保存フォルダ Cookie

1.アクセス

2.IDをCookieに保存

3.セッション変数を指定のフォルダに保存

【Cookieとは？】ブラウザに用意された書き込みを許可された領域。 PHPが書き込める伝言板のようなもの。容量は4096byteまで。ブラウザが許可していない場合は書き込めない。

2.セッション利用時

セッション保存フォルダ Cookie

1.アクセス

2.Cookieを見て、セッションIDがあるかどうかを確認

3.セッションIDがあれば、該当する変数を取得

【セッションファイルの保存期限】セッションファイルは一定期間（初期設定では24分）で削除されます。セッション変数はフォルダではなく、データベースに保存することもできます。

Technology

07 ソーシャルブックマーク(2)