php掲示板、入力チェックとパスワ－ド

php講習 1/24　第８週目

・1/21はお休みしました。

・本日の掃除は東浜でした。

＜１時間目＞

・FizzBuzzをプログラムにする。

　出来たらメールで送付。

＜２時間目＞

・入力チェックを試す

未入力チェック、入力文字数のチェック

htmlとphpを分離させてhtmlの途中でメッセージを表示する。

＜３時間目＞

・入力チェックを試す（文字数チェック）

if (mb_strlen($text,"utf8")>=20) {
          $error_msg = "文字数が２０文字以上入力されています！" ;
     }

mb_strlen（文字数のカウントで日本語を扱うときはこちら）

・もうひとつの関数strlenの確認（日本語だと文字数ではなく、バイト数で扱われる）

・文字数４文字以上で１６文字まで、それ以外をエラーとする

if ((mb_strlen($text,"utf8")<4) or (mb_strlen($text,"utf8")>16) ){
          $error_msg = "文字数が４文字以上、１６文字以下ではありません" ;
     }

・正規表現で英数字のチェックをする

if (mb_ereg('[^0-9a-zA-Z]',$text)) {
          $error_msg = "英数字で入力してください" ;

     }　

＜４時間目＞

・掲示板のパスワード入力チェックに適用する。

　文字数チェック（４文字以上、１６文字まで）

　英数字チェック

<index.php>

フォームにpasswdの入力を追加
<submit.php>
passwordの受け取り
入力フラグ初期化
入力チェック
DBへの書き出し

<reply.php>
フォームにpasswdの入力を追加
<reply_submit.php>
passwordの受け取り
入力フラグ初期化
入力チェック
DBへの書き出し

＜５時間目＞

・掲示板のパスワード入力チェックに適用する。

　引き続き作業

・答え合わせ

☆インターネットサービスの紹介

・8tracks

　気に入った音楽８曲をアップしているサイト

（著作権で保護されているもの意外）

　twiterとの連携あり

・last.fm

APIとしてhtmlからの操作が可能

＜６時間目＞

・掲示板のパスワード入力チェック後削除フラグを立てる。

（１）にパスワード入力フォームの追加を行う。
   delete.php
       パスワード<br />
       <input type="password" name="passwd" size="20" /><br />
   reply_delete.php
       パスワード<br />
      <input type="password" name="passwd" size="20" /><br />

（２）にパスワードをリクエストから受け取るようにする。
  delete_submit.php
$passwd   = $_POST["passwd"]; 
  reply_delete_submit.php

（３）リクエストで受け取ったパスワードを書くチェックを行う
    ・未入力チェック
    ・英数字チェック
    ・桁数チェック
    ・データベースのデータと合っているかのチェック(new)
  delete_submit.php
  reply_delete_submit.php

（４）チェックを通過した際には削除ができること
  delete_submit.php
  reply_delete_submit.php

・お休みしていた間に不足していた機能の追加

　reply_delete.php,reply_delete_submit.php

phpでfileの情報を受け取れない

phpで$_FILES[""]でfileの情報を受け取れない。


formタグで「enctype」の指定を忘れるとfileの情報は受け取れません。
<form action="" method="post" enctype="multipart/form-data">

良くやってしまうことなので、忘れないように書いておくことにしました。

php掲示板、画像のアップロード

php講習　1/13

・今日も掃除は東浜でした。

・今日は、内容が多いのと、ソースが混じっているので間違いが多いと思います。

　また、番号も正しく番号順に並んでいないところもあります。

　おかしいところは、気が向いたらあとで修正します。

＜１時間目＞

・準備は、昨日と同じ

　eclipse,zampp,mySQLクライアントの起動

　課題テキストPDFを開く

　機能追加部分のテキスト修正確認用に「さくら」も

　アップロード用jpg画像

・昨日は、画像のアップロードが出来るところまで

　昨日お休みした人が必要な作業

　　commentテーブルのカラム追加（url,photo）

　　phpプログラムの更新

・掲示板の拡張、続き

<submit.php>

     $sql =" update comment set photo ='".$row[0].".jpg'
     WHERE id = ".$row[0];
     mysql_query($sql);

　SQL文のファイルIDに余分な空白が入っていると、あとでjpgファイルを呼び出すとき

　見つからないので、余分な空白は取り除く。

・変更後の確認作業、photoカラムにファイル名が設定されていることを確認する

     select * from comment;

     select * from comment order by id desc limit 1\G

＜２時間目＞

・jpg画像表示

　<index.php>

           print '<img src="./img/' . $row1['photo'] . '" alt="' . $row1['photo'].'" width=150>' ;

・画面にjpg画像が表示されればOK。

・画像を２つ表示させてみよう。

1.commentテーブルにphoto2というカラムの追加を行う

2.プロジェクト直下にimg2というディレクトを作成する

3.index.phpに2個目の画像の入力フォーム追加を行う

4.submit.phpに画像の受け取りとリネームを行う処理の追加を行う

5.commentテーブルにphoto2の更新の処理を追加する

6.index.phpに2個目の画像の表示を追加する。

<作業>

1.commentテーブルにphoto2というカラムの追加を行う
ALTER TABLE comment ADD photo2 TEXT AFTER photo ;
・カラムの追加を確認
desc comment ;

2.プロジェクト直下にimg2というディレクトを作成する

eclipseからフォルダ追加

・windowsのエクスプローラからフォルダを確認する
C:\pleiades\xampp\htdocs\bbs\img2

3.index.phpに2個目の画像の入力フォーム追加を行う
PHOTO2<br>
<input type="file" name="photo2" id="photo2" /><br />
・確認
画面上でアップロードファイルパスが表示されることを確認する

4.submit.phpに画像の受け取りとリネームを行う処理の追加を行う
// 画像データ2を保存する。
if (is_uploaded_file($_FILES['photo2']['tmp_name'])){
     move_uploaded_file($_FILES['photo2']['tmp_name'], "./img2/".$row[0].".jpg");
}
・確認
投稿して、ファイルをアップロードする
img2フォルダにファイルがアップロードされていることを確認する
(imgとimg2のファイルIDが同じになっているが、内容は異なる)

5.commentテーブルにphoto2の更新の処理を追加する
#  画像データのファイルIDをDBに更新する
$sql =" update comment set photo2 ='".$row[0].".jpg'
WHERE id = ".$row[0];
mysql_query($sql) or die(mysql_error());
・確認
投稿して、ファイルをアップロードする
結果がDB上更新されていることを確認する

6.index.phpに2個目の画像の表示を追加する。
print "<br />" ;
print '<img src="./img2/' . $row1['photo2'] . '" alt="' . $row1['photo2'].'" width=150><br />' ;
・確認
投稿して、画像2が表示されることを確認する

＜３時間目＞

7.画像が登録されているときだけ表示を行う処理を入れる。

（現在は画像が登録されていない場合でもimgタグが表示されています）

8.URLが入力されているときだけリンクに表示処理を行うようにする。

（現在はURLが登録されていない場合でもimgタグが表示されています）

ヒント：エラーチェックを行っている仕組みとほぼ同じです。要応用。

9.返信関連の機能にも画像投稿が出来るようにして見ましょう。

10. ７と８の項目も次いでに実装して見ましょう。

（reply.php, reply_submit.php, index.phpに画像の処理を追加する）

7.画像が登録されているときだけ表示を行う処理を入れる。

（現在は画像が登録されていない場合でもimgタグが表示されています）          

if (($row1['photo']=="") or ($row1['photo']==null)) {

}  else {
     print "<p>" ;
     print '<img src="./img/' . $row1['photo'] . '" alt="' . $row1['photo'].'" width=150><br />' ;
     print "</p>" ;
}

・確認方法

HTMLソースを見て、<img>タグがないことを確認する。

8.URLが入力されているときだけリンクに表示処理を行うようにする。

（現在はURLが登録されていない場合でもimgタグが表示されています）

if (($row1['url']=="") or ($row1['url']==null)) {
     print $row1['nickname']."さんの投稿<br />";
}  else {
     print '<a href="'.$row1["url"].'">'.$row1['nickname']."</a>さんの投稿<br />";

}

・確認方法

HTMLソースを見て、<a href="">タグがないことを確認する。

9.返信関連の機能にも画像投稿が出来るようにして見ましょう。

     1.replyテーブルにphotoというカラムの追加を行う
     2.プロジェクト直下にimg3というディレクトを作成する
     3.reply.phpに画像の入力フォーム追加を行う
     4.submit.phpに画像の受け取りとリネームを行う処理の追加を行う
     5.replyテーブルにphotoの更新の処理を追加する
     6.index.phpに画像の表示を追加する。

10.7と8の項目もついでに実装してみましょう。

9.返信関連の機能にも画像投稿が出来るようにして見ましょう。

・返信関連対象

（reply.php, reply_submit.php, index.phpに画像の処理を追加する）

・処理

　1.replyテーブルにphotoというカラムの追加を行う

　2.プロジェクト直下にimg3というディレクトを作成する

　3.reply.phpに画像の入力フォーム追加を行う

　4.submit.phpに画像の受け取りとリネームを行う処理の追加を行う

　5.replyテーブルにphotoの更新の処理を追加する

　6.index.phpに画像の表示を追加する。

・photo2の（１）-（６）を説明。

・引き続き（７）（８）の機能を追加する。

＜４時間目＞

・（７）（８）の機能を追加した処理の解説

・引き続き（９）（１０）の機能を追加する。

1.replyテーブルにphotoというカラムの追加を行う
ALTER TABLE reply ADD photo TEXT AFTER url ;
・カラムの追加を確認
desc comment ;

2.プロジェクト直下にimg3というディレクトを作成する
eclipseからフォルダ追加
・windowsのエクスプローラからフォルダを確認する
C:\pleiades\xampp\htdocs\bbs\img3

3.reply.phpに画像の入力フォーム追加を行う
PHOTO<br>
<input type="file" name="photo" id="photo" /><br />
・確認
画面上でアップロードファイルパスが表示されることを確認する

・
<form action="submit.php" method="post" enctype='multipart/form-data'> 内容<br>
     <form action="reply_submit.php" method="post"  enctype='multipart/form-data'>

4.reply_submit.phpに画像の受け取りとリネームを行う処理の追加を行う
// 最後に入れたID を取得する
$sql = "select id from reply order by id desc limit 1";
$result = mysql_query($sql);
$row = mysql_fetch_row($result);
// 画像データ2を保存する。
if (is_uploaded_file($_FILES['photo']['tmp_name'])){
     move_uploaded_file($_FILES['photo']['tmp_name'], "./img3/".$row[0].".jpg");
}
・確認
投稿して、ファイルをアップロードする
img3フォルダにファイルがアップロードされていることを確認する

5.replyテーブルにphotoの更新の処理を追加する
#  画像データのファイルIDをDBに更新する
$sql =" update reply set photo ='".$row[0].".jpg'
WHERE id = ".$row[0];
mysql_query($sql) or die(mysql_error());
・確認
投稿して、ファイルをアップロードする
結果がDB上更新されていることを確認する

6.index.phpに画像の表示を追加する。
if (($row2['photo']==null) or ($row2['photo']==null)) {
}  else {
     print "<br />" ;
     print '<img src="./img3/' . $row2['photo'] . '" alt="' . $row2['photo'].'" width=150><br />' ;
}
・確認
投稿して、画像が表示されることを確認する

10.7と8の項目もついでに実装してみましょう。
返信に対してurlとpicファイルのチェックを追加する。
<index.php>
7.（返信で）画像が登録されているときだけ表示を行う処理を入れる。

（現在は画像が登録されていない場合でもimgタグが表示されています）    
if (($row2['photo']=="") or ($row2['photo']==null)) {
}  else {
     print "<p>" ;
     print '<img src="./img/' . $row2['photo'] . '" alt="' . $row2['photo'].'" width=150><br />' ;
     print "</p>" ;
}
・確認方法
HTMLソースを見て、<img>タグがないことを確認する。

<index.php>
8.（返信で）URLが入力されているときだけリンクに表示処理を行うようにする。
（現在はURLが登録されていない場合でもimgタグが表示されています）
if (($row2['url']=="") or ($row2['url']==null)) {
     print $row2['nickname']."さんの返信<br />";
}  else {
     print '<a href="'.$row2["url"].'">'.$row2['nickname']."</a>さんの返信<br />";
}
・確認方法
HTMLソースを見て、<a href="">タグがないことを確認する。

＜５時間目＞

・引き続き（９）（１０）の機能を追加する。

・（９）（１０）の機能を追加した処理の解説

・htmlのソースをみるときたないので、明日整理します。

また、htmlとphpが交じり合っているので、綺麗にする方法を話します。

・本日の作業項目は、メールで送ります。

・作業項目は多いですが、項目のひとつひとつは簡単なものなので、

疑問点があれば整理しておいてください。

・明日の予定（１-２時間）

デバックの方法について(ポイント)説明

掲示板の再構成

php掲示板作成

php講習　1/7
・今日の清掃は、東浜でした。（名前が付いているなんて知らなかった）

＜１時間目＞

・昨日の復習

フォームタグのpostメソッドとgetメソッド

$_requestだとどちらのメソッドで送信したものでもphp側で受けられる。

「print_r($_request) ;」で内容を確認可能。

・昨日はさくらエディタでhtmlファイルを編集していたが、今日eclipseで開けたら文字化けしていた。

文字コードはutf8にしていたが、sjisに戻したら表示された。

しかし、FireFox側で、受けるphpの表示が文字化けする。

とりあえず、htmpファイルをeclipseから見るのはあきらめて、設定を戻した。

→文字化け対応はいろいろありますが、どれも一長一短

＜２時間目＞

・引き続きフォームの練習

受け取ったphp側に入力チェックを入れる。

もし未入力の場合、メッセージを出力する。（if文）

・phpプログラムを修正したとき、FireFoxでctrl+Rでリフレッシュできるの知らなかった。

毎回メニューから更新を選択してました。

＜３時間目＞

・eclipseの使い方復習

プロジェクトbbsを新規に作成

・課題（掲示板作成）の説明

最初にmysqlで今回使用するcommentとreplyテーブルを作成

create table comment

create table reply

作ったらテーブルの構成を確認

desc  comment ;

show create table comment ;

・課題のテキストにしたがい、ファイルを作成

内容をコピーしていく。

＜４時間目＞

・課題のテキストにしたがい、内容をコピーしていく、続き。

　追加の処理を間に入れ、インデントをして見やすくする。

・インデントをeclipsでやる方法

　対象の行を選択し、「TAB」キーを押す、「shift」+「TAB」で戻す。

・ソースの追加が終了したら、index.phpで

　サンプルのDB名、ユーザID、パスワードを自分の環境に合わせる。

・エラーチェックの確認

　index.phpのエラーチェックがうまくいったら、投稿してみる。

　投稿したらmysqlクライアントから、テーブルの内容を確認

　　select * from comment;

　投稿の内容が大きいと画面の表示が崩れてしまう。そのときは、縦に表示する。

　　select * from comment\G

　index.phpに処理を追加

・Firebugでレイアウトを確認

・返信(reply.php)の処理追加

＜５時間目＞

・返信(reply.php)の処理

追加後の確認作業

・今後の作業のため、投稿してデータを５件くらい作っておく。　

・これからは、プログラムには、先頭にコメントを入れる。

・eclipseのソース

タイトルをダブルクリックすると、全画面表示

２つのプログラムの比較をするとき、タイトルを下にドラックすると２画面分割表示になる。

色々やりすぎて、画面が戻せなくなったら、パースペクティブのリセット

アウトラインの変数名をダブルクリックすると、使っている部分の色が変わる。

・今日やったところを復習、整理

・掲示板の残りは火曜日

1/11は午前中２時間のみらしい

phpの練習問題とフォーム

php講習　1/6

・明けましておめでとうございます。

　最初に教室でロッカーからPCを出すとき、数が少なくてびっくり。

　私は持って帰らなかったけど、皆PCを持ち帰っていたんですね。

・今日の掃除は、海岸でも河の方を歩きました。

　生活している人がいるような小屋があって驚きました。

・年末年始で教室の環境が変わっているらしく、１時間目は宿題で自習。

　宿題は、03_loopから05_functionまでやったけど、回答を持ってくるのを忘れました。

　年末にもらった資料で、掲示板のソースを自分のPCに入れました。

　掲示板用にmysqlの環境設定も実施。

・本日の予定

　一戸先生がお休みになった。

　前半は、冬休みの宿題の解説。

　後半は、年末に配布した掲示板の資料の説明。

・宿題の実行環境について

　apacheで認識するため、/htdocの下にフォルダごと展開して下さい。

　デスクトップにあるとapacheが認識できません。

・宿題の九九の表を作成

　８＊８にしたら、市松模様にならなかったのでロジックを修正。

　Firebugで結果を確認していたら、閉じタグのバグを見つけてしまいました。
　閉じタグは無くても動くんですね。私のように間違う人が多いから、相手にしてると
　画面表示が乱れて使い物にならないのか。

・宿題のファンクションを作成

・明日からやる資料の課題に進む前に事前説明

　htmlとphpが混在したソースの動きについて。

　時刻を表示したが、PCの表示と時刻が６分ほどずれているのはなぜ？

＜フォームとパラメータ＞

・事前説明、その２、フォームと使うタグについて

　事前説明サンプルのHTMLファイルはエディタで開いて内容を確認する。
　そのままファイルをダブルクリックするとFireFoxから開いてしまいます。

　動かすときは、httpのパスを使ってFirefoxから開いて動かす。
　ダブルクリックで開くとfileパスになり、apache経由ではありません。
　submitしたときの動作が異なります。

　インプットタグ（テキスト、ラジオボタン、サブミット）（チェックボックスは後日説明します）

　セレクトタグ

・htmlファイル側からPOSTで渡した値は、phpファイル側の$_post変数（連想配列）で値を取り出す。

　$_post変数は、var_dump()か、print_r()で配列の内容を確認可能。

・GETで渡した値は、$_GET変数で受け取る。

・練習問題

・練習問題、その２、会員登録画面

　氏名、年齢、住所、電話番号はテキスト

　性別：ラジオボタン

　都道府県：選択式

・文字化けするときは、送信側htmlファイルと、受信側phpファイルの文字コードがutf8か確認する。

・練習問題、その３、ログイン画面

　ID,passwdが一致したときに「会員様ようこそ」

　失敗したときはプログラムを終了。