SAMPLE

17PHPスクリプトとHTML（備忘録）→ > 01p > 02p > 03p > 04p > 05p > END

１７PHPスクリプトとＨＴＭＬ(p381)
（１）《ＨＴＭＬソース　ｐ０００》
（２）《Ｗｅｂページを生成する２つの方法　ｐ０００》
（３）《ＨＴＭＬの規則　ｐ０００》
（４）《ＨＴＭＬファイルをＰＨＰスクリプトで書き出す　ｐ０００》
（５）《さらに覚えておきたいタグ　ｐ０００》
（６）《ヒアドキュメントとｎｌ２ｂｒ関数》
（７）《ブラウザからＰＨＰでデータを送信する　ｐ３９６》
（８）《POSTとGETによるデータ送信　ｐ０００》
＜まとめ＞
＜チェック＞
＜練習問題＞
END

04MySQL+PHPの基礎

｢基本からのMySQL｣ですが、今やWebでの利用を考えずにMySQLを勉強することはできません。MySQLを利用するために必要な範囲でのWebとPHPの知識を勉強します。
☆CHAPTER15⇒MySQＬを利用するためのPHP
☆CHAPTER16⇒PHPの基礎知識
★CHAPTER17⇒PHPスクリプトとHTML
☆CHAPTER18⇒PHPスクリプトでMySQLを操作する

★CHAPTER17⇒PHPスクリプトとＨＴＭＬ(p381)★

PHPによるSQL操作の基礎となるHTMLの知識と、Webページからデータ送信と受信の処理を学びます。MySQL+PHPのようなWebアプリケーシヨンを使う上で、欠かすことのできない知識です。

（１）《ＨＴＭＬソース　ｐ０００》

ＨＴＭＬファイルは、｢ＨＴＭＬ｣という規則に従って作られた単純なテキストファイルです。そしてブラウザは、Ｗｅｂサーバーから送られたＨＴＭＬファイルの命令に従って、いっしょに、送られてきた文字や画像を配置しているだけです。

▲Ｔｏｐ

（２）《Ｗｅｂページを生成する２つの方法　ｐ０００》

｢静的なＷｅｂページ｣と｢動的なＷｅｂページ｣がありますが、この｢静的｣｢動的｣について、もう少し掘り下げてみましょう。
Ｗｅｂページを作成する方法には、次の２つがあります。
①エディタでタグを入力する、または｢Ｗｅｂページ作成ソフト｣でタグを作成する
②ＰＨＰスクリプトなどのプログラムによって、タグを書き出す。

（２－１）＜①静的なＷｅｂページ作成＞

ＨＴＭＬファイルは、テキストでできているので、文法規則を理解していれば、メモ帳などのエディタで簡単に作ることができます。
たとえば、｢こんばんは｣という内容のＷｅｂページは、誰がいつアクセスしても｢こんばんは｣としか表示されません。このようなものを｢静的Ｗｅｂページ｣といいます。

（２－２）＜②動的なＷｅｂページ作成＞

たとえば、次のＰＨＰスクリプトをいいます。 =18){ print "こんばんは"; }elseif(date("G")>=9){ print "こんにちは"; }elseif(date("G")>=6){ print "おはようございます"; }else{ print "眠くないですか"; } ?> ※実行すると、時間ごとに、それぞれが表示されます。
このように、ＰＨＰスクリプトなどのプログラムによって間接的に書き出され、条件によって異なる内容を表示するものを｢動的なＷｅｂページ｣といいます。

（２－３）＜ブラウザは静的なページと動的なページを区別しない＞

①の方法、つまりエディタやＷｅｂページ作成ソフトで、直接タグを書き出すことで、作ったＨＴＭＬファイル。そして
②の方法、つまりＰＨＰなどのプログラムを使って間接的に、動的に書き出したＨＴＭＬファイル。この２つを、ブラウザは区別することはありません。クライアント側には、まったく同じ様に表示されます。
※私たちの目標は、ＭｙＳＱＬとやり取りした結果をＷｅｂページとして書き出し、クライアントに送り返すことです。
※ＰＨＰスクリプトを使ってＭｙＳＱＬを操作し、ＭｙＳＱＬが処理して送ってきた結果をまたＰＨＰスクリプトで受け取り、Ｗｅｂページを動的に書き出していくことになります。

▲Ｔｏｐ

（３）《ＨＴＭＬの規則　ｐ０００》

ＰＨＰスクリプトを使ってＭｙＳＱＬを操作するには、ＨＴＭＬの知識が必要です。
●ＭＴＭＬファイルの拡張子｢.html｣、ＰＨＰスクリプトがあれば｢.php｣ＨＴＭＬファイルは、｢｣などのようなタグからできているテキストファイルです。拡張子は｢.html｣または｢.htm｣です。だだし、この中にＰＨＰスクリプトを含める場合には、｢.php｣の拡張子をつける必要があります。
●タグは半角で記述、大文字・小文字を区別しないＨＴＭＬでは、タグを半角文字で記述します。大文字、小文字は区別しません。つまり、｢<HTML>｣｢<Html｣｢<html>｣のいずれも同じものとして扱われます。
●ＨＴＭＬファイルの構成ＨＴＭＬファイルは、その始まりに｢<HTML>｣、終わりに｢</HTML>｣を記述します。｢<HTML>～</HTML>｣の中に、次のような２つのブロックに分かれています。
●書式⇒<HTML>～</HTML>の中の２つのブロック <HTML>
ページタイトルやリンクの関係など記述
</HTML>
<BODY>
Ｗｅｂページとして表示される本体を記述
</BODY>
385p_tag.html

▲Ｔｏｐ

（４）《ＨＴＭＬファイルをＰＨＰスクリプトで書き出す　ｐ０００》

では、ＷｅｂページをＰＨＰスクリプトで書き出してみよう。
※背景色を青に設定して書き出すＰＨＰスクリプトを作成してみましょう。

<?php
print "<HTML>";
print "<HEAD>";
print "<TITLE>";
print "ＳＱＬカフェのページ";
print "</TITLE>";
print "</HEAD>";
print "<BODY BGCOLOR='blue'>";
print "ＳＱＬカフェにようこそ！";
print "</BODY>";
print "</HTML>";
?>
※単純にタグを｢print｣（またはecho）で書き出すだけです。
なを、<HTML><TITLE><HEAD><BODY>のタグは省略することもできます。

<?php
print "ようこそ";
?>
※最近では、Ｗｅｂページ作成においては｢Ｗｅｂ標準｣にのつとった厳密なＨＴＭＬの記述が求められています。従って、省略しない方が良い。
387p_ao.php

▲Ｔｏｐ

（５）《さらに覚えておきたいタグ　ｐ０００》

●<BR>タグ

改行を表すタグです。ＨＴＭＬファイル中の文字列をいくらリターンキーで改行しても、ブラウザの表示が改行されることはありません。テキストを改行させるときは、＜BR＞タグを使います。

●<FONT>タグ

文字のサイズや色を指定するタグです。サイズは｢1～7｣が指定できます。
例：文字のサイズ｢7｣、色を｢青｣
<?php
print "<FONT size='7' color='blue'>ＳＱＬカフェ！</FONT>";
?>
388p_kaigyo.php

●<U>タグ、<B>タグ、<I>タグ

それぞれのテキストに対して、｢<U>｣はアンダーライン、｢<B>｣は太字、｢<I>｣はイタリックを設定するタグです。

●<HR>タグ

水平線を入れます。たとえば｢<HR size = '5'>とすると５ピクセルの幅になる｣など、いろいろ属性が設定できます。

●<A>タグ

<A>タグはリンクを設定します。HREF属性でリンク先のＵＲＬを指定します。
｢<A>～</A>｣の間に、リンク箇所に表示される文字列を囲みます。

●<IMG>タグ

画像を表示させるときに、<IMG>タグを使います。次のような形式で記述します。書式⇒<IMG>タグの使い方代替テキスト

●<META>タグ

<META>タグはページの情報を設定するタグで、多くの機能があります。たとえば、｢検索ロボットの検索に引っかかってほしいキーワードを設定｣｢検索結果に表示される文章を設定｣｢自動的に指定したページに移動させるように設定｣｢文字コードを設定｣・・・と、いろいろな情報が設定できます。ここでは、ＰＨＰで文字を書き出すときの文字化けを防ぐため、｢ページの文字コードを設定する方法｣を説明します。

●書式⇒<META>タグで文字コードを設定

<META http-equiv="Content-Type" content="text/html;charset=文字コード">
｢文字コード｣の部分には、たとえば次を指定します。

●指定可能な文字コード

【画像】

▲Ｔｏｐ

（６）《ヒアドキュメントとｎｌ２ｂｒ関数》

（６－１）＜ヒアドキュメントとは＞

ＰＨＰスクリプトを使ってＷｅｂページを書き出すということは、ＨＴＭＬタグをテキストとして｢print｣や｢echo｣で書き出すことになります。
｢print｣などで書き込むタグは文字列なので｢""｣で囲むことになります。
しかし、｢属性値を''で囲え｣とか｢\を付けろ｣とか、面倒な指定が多い。
こんなときに便利なのが、大量の文字列を変数に格納するヒアドキュメント（here document）です。
次は、ヒアドキュメントを使って記述しています。(here.php)
又｢終了を表す文字｣は｢eot｣(end of tex)としてみました。
<?php
$mozi=<<<eot
<HTML>
<HEAD>
<TITLE>ＳＱＬカフェのページ</TITLE>
</HEAD>
<BODY BGCOLOR="blue">
ＳＱＬカフェにようこそ！
</BODY>
</HTML>
eot;
print $mozi;
?>
※｢""｣｢''｣がよく入るＳＱＬ文やＨＴＭＬタグの記述ではヒヤドキュメントが重宝します。

（６－２）＜ｎｌ２ｂｒ関数とは＞

次の、nl2br_nasi.phpを表示してみよう。
<?php
$str=<<<eot
こんちには
こんばんは
eot;
print $str;
?>
※しかし、これを実行すると単に１行で｢こんにちはこんばんは｣と表示されてしまいます。
こんなときは、｢改行うコードがある場合、改行タグを挿入する｣機能を持つnl2br（｢エヌエル　ツービーアール｣）という関数を使いましょう。
※それでは、｢$str｣の値をnl2br関数で処理してprintで書き出してみましょう。
<?php
$str=<<<eof
こんちは
こんばんは
eof;
print nl2br($str);
?>
※こうすることにより、改行の機能が再現されます。

▲Ｔｏｐ

（７）《ブラウザからＰＨＰでデータを送信する　ｐ３９６》

ＰＨＰを使ってブラウザからデータをやり取りする手順を説明します。

（７－１）＜ブラウザとＰＨＰファイルとのデータのやり取り＞

まず、ブラウザからＭｙＳＱＬを操作するときの、データのやり取りを考えてみよう。 ①ブラウザに表示されたＷｅｂページから、ユーザーがデータを送信 ②Ｗｅｂサーバーに置かれているＰＨＰファイルが、データを受け取る ③ＰＨＰスクリプトが、ＭｙＳＱＬデータベースとやり取りを行なう ④ＰＨＰスクリプトが、結果を載せたＷｅｂページを書き出しブラウザに送り返す。 ⑤ブラウザが結果を受け取る ※ＭｙＳＱＬを使う前に、ここではＨＴＭＬファイルとＰＨＰスクリプトの間でデータをやり取りする手順を学びましょう。次のような仕組みを作ってみます。

●データの送り側

・ＭＴＭＬファイル｢okuri.html｣・テキストボックスに入力した文字列を、送信ボタンをクリックすることで送信する

●データの受け側

・ＰＨＰファイル｢uke.php｣・受信したデータをそのまま表示

（７－２）＜データを送信するＷｅｂページ「okuri.html」を作る＞

まずは、｢Ｗｅｂページからデータを送信する｣を行なうＨＴＭＬファイルです。ここでは、ボタンをクリックすると、テキストボックスに入力されたデータを送信されるという仕組みを設定します。
okuri.html
なお、ここでは、<HTML><HEAD><BODY>など省略します。
<FORM ACTION="uke.php" METHOD="post">
<INPUT TYPE="text" NAME="a">
<BR>
<INPUT TYPE="submit" VALUE="送信">
</FORM>
※フォームの表示に成功したら、入力タブの機能をみてみましょう。

●<FORM>タグの形式

<FORM ACTION="データの送信先" METHOD="送信の方法">
ここに<INPUT>タグ等を記述することで、ボタンやボックスを設定
</FORM>

●<FORM>タグに設定する主な属性（p399_1）

●<INPUT>タグ

｢<INPUT>｣タグを｢<FORM XX>｣の間に記述することで、送信用のデータを入力するテキストボックスや、送信用のボタンなど部品が設定できます。

●書式⇒<INPUT>タグの形式

・INPUTタグに設定できる主な属性

（属性）→（内容）
TYPE→部品の種類を設定する文字列を記述
NAME→その部品に付ける｢識別する名前｣を設定
SIZE→テキストボックスの幅を設定する
VALUE→ボタンなどで文字列が表示される場合、その文字列を設定する

・タイプ属性の設定

（記述）→（設定される部品の種類）
TYPE="submit"→データを送信する機能を持つボタン
TYPE="button"→ボタン
TYPE="text"→テキストボックス
TYPE="checkbox"→チェックボックス
TYPE="radio"→ラジオボタン
TYPE="hidden"→表示なし（データ送信だけ）

●INPUTタグを使った例

①次は、｢データを識別するための名前｣を｢a1｣としたサイズ50のテキストボックスです。
<INPUT TYPE="text" NAME="a1" SIZE="50">
②次は、｢クリック｣と表示されている送信用ボタン
<INPUT TYPE="submit" VALUE="クリック">
③次は、｢データを識別するための名前｣を｢r1｣として、｢bad｣という値を送信するラジオボタンです。
<INPUT TYPE="radio" NAME="r1" VALUE="bad">
④次は、ブラウザには何も表示されませんが、｢隠れデータ｣という文字を送信します。
<INPUT TYPE="hidden" VALUE="隠れデータ">
※これは、ユーザーには見せる必要のないデータを強制的に送信するときに使います。

（７－３）＜データを受信して表示する「uke.php」を作る＞

今度は、受取側の｢uke.php｣についてです。｢okuri.html｣のテキストボックスで入力されたデータを受信します。 POST送信で送られたデータは、次のように$_POSTという変数で受け取ることができます。

●書式⇒METHOD="POST"で送信されてきたデータが入る変数

$_POST["データを識別する名前"] ※｢$_POST｣は、PHPであらかじめ決められている変数名です。ここではPOSTで送信されたデータが配列として保管されます。 ※｢$_POST｣は、連想配列として扱うことができます。配列の添え字は｢データを識別する名前｣を指定します。 ※今回送信されるデータが入力されるテキストボックスは、｢a｣という｢データを識別する名前｣が付いていました（NAME="a"）。このため｢uke.php｣側では、連想配列の添え字に"a"を指定して、｢$_POST["a"]｣と記述すれば、送信されたデータを取り出すことができます。

●書式⇒｢NAME="a"｣のテキストボックスの値を受け取る変数$_POST["a"]

※それでは単純に書き出す｢uke.php｣です。
<?php
print $_POST["a"];
?>

（７－４）＜データを送信し受信する＞

実際に送受信してみてください。送り側はokuri.htmlを起動して、文字を入力して送信。するとこれで｢uke.php｣にデータが渡され、入力された文字が表示されます。

▲Ｔｏｐ

（８）《POSTとGETによるデータ送信　ｐ０００》

（８－１）＜データ送信の方式「POST」と「GET」＞

データを渡す方法には、POSTの他にGET送信があります。POSTとGETそれぞれの特徴は次のようになります。

●POST送信

・データはURLには付けない・送信できるデータはテキストとバイナリの両方が可能

●GET送信

・URLに付けてデータを送る（データが見られてしまう。）不正なデータを送信される恐れがある・送信できるデータはテキストのみ・何も宣言しなければGETメソッドが使われる（デフォルト）

（８－２）＜GETメソッドでGET送信を行なう＞

｢GET送信｣を行なう場合は、たとえば前項で作成した｢okuri.html｣と｢uke.php｣なら、リストの中に記述されている｢POST｣の文字をそのまま｢GET｣に変えれば、送信のメソッドが｢GET｣になります。

（８－３）＜GETとPOSTの違い＞

GETで送信するとき、そしてその結果を表示するときも、POSTとほとんど同じです。しかし、１か所だけPOST送信とは違うところがあります。実は、GET送信のときはURLの後に、｢?a=%91%97&90…｣のような表示が付くのです。これに対してPOST送信のときは、アドレスバーに単純に｢http://localhost/uke.php｣と表示されるだけです。

●書式⇒GETメソッドでのアドレスバーの表示

URL?データ名=データ ※データを盗み見られてしまう可能性も考えられるので、セキュリティ上の問題を十分考慮する必要があります。

（８－４）＜GETメソッドでURLに値を付けて送信してみる＞

｢GET送信では、データをURLにくっ付けて送る｣ということでした。ということは、実はＨＴＭＬファイルを使わなくても、ＵＲＬにデータをくっ付ければGET送信ができてしまう。では、GET送信を送ってみましょう。前項での｢get_okuri.php｣を使って、｢12345｣のデータを送ってみましょう。次の文字列をアドレスバーに入力しエンターを押してみてください。 http://localhost/get_uke.php?a=12345 ※ブラウザに、｢12345｣と表示されるはずです。

（８－５）＜何も宣言せずにデータを送信する＞

なお、何も宣言しなければ自動的に｢GET送信｣になります。
※たとえば、特に<FORM>タグを設定することなく、いきなり次のハイパーリングだけのファイルを作ってみてください。
例→get_okuri2.html
<a href="get_uke2.php?a=777">777を送るからね</a>
そして、ファイルでこれを受けます。
例→get_uke2.php
<?php
print $_GET["a"];
?>
※これだけで｢777｣送受信され、｢777｣と表示されます。
METHOD="GET"などの、面倒な宣言不要でデータが送られてしまうのです。

▲Ｔｏｐ

＜まとめ＞

●動的なWebページと静的なＷｅｂページの違い
●基本的なHTMLタグの記述方法
●Webページからのデータ送信とPHPスクリプトでの処理、その流れ
●データを送信するフォームの作成方法
●送信方法の種類

▲Ｔｏｐ

＜チェック＞

□HTMLの基本的な記述方法がわかる
□<BR><FONT><U><B><I><HR><A><IMG><META>の、各タグの意味を理解している
□<RORM>タグを使ってフォームが作成できる
□INPUTタグの使い方を理解している
□テキストボックスの値をPOST送信することができる
□GET送信できる
□POSTとGETの違いを理解している

▲Ｔｏｐ

＜練習問題＞

問題１
次のような｢100個のラジオボタンから選択して年齢データを送信するフォーム｣（radio.php）と、それを｢受信して、年齢を含むメッセージを表示するPHPスクリプト｣（rado_uke.php）を作成してください。

《解答1》

次のスクリプトを作成します。
■｢radio.php｣（送信用フォームのPHPスクリプト）

<FORM ACTION="radio_uke.php" METHOD="post">
あなたの年齢を選択して、送信ボタンをクリックしてください。<BR>

<?php

$i=1;
$c=1;

while($i<=100){
print "<INPUT TYPE='radio' NAME='r' VALUE='$i'>$i ";
if($c==10){
print "<BR>";
$c=0;
}
$i++;
$c++;
}

■｢radio_uke.php｣（受信用PHPスクリプト）
<?php
print "あなたの年齢は".$_POST["r"]."歳なのですね";
?>

【実行結果】

未処理

▲Ｔｏｐ

04MySQL+PHPの基礎

★CHAPTER17⇒PHPスクリプトとＨＴＭＬ(p381)★

（１）《ＨＴＭＬソース ｐ０００》

（２）《Ｗｅｂページを生成する２つの方法 ｐ０００》

（２－１）＜①静的なＷｅｂページ作成＞

（２－２）＜②動的なＷｅｂページ作成＞

（２－３）＜ブラウザは静的なページと動的なページを区別しない＞

（３）《ＨＴＭＬの規則 ｐ０００》

（４）《ＨＴＭＬファイルをＰＨＰスクリプトで書き出す ｐ０００》

（５）《さらに覚えておきたいタグ ｐ０００》

●<BR>タグ

●<FONT>タグ

●<U>タグ、<B>タグ、<I>タグ

●<HR>タグ

●<A>タグ

●<IMG>タグ

●<META>タグ

●書式⇒<META>タグで文字コードを設定

●指定可能な文字コード

（６）《ヒアドキュメントとｎｌ２ｂｒ関数》

（６－１）＜ヒアドキュメントとは＞

（６－２）＜ｎｌ２ｂｒ関数とは＞

（７）《ブラウザからＰＨＰでデータを送信する ｐ３９６》

（７－１）＜ブラウザとＰＨＰファイルとのデータのやり取り＞

●データの送り側

●データの受け側

（７－２）＜データを送信するＷｅｂページ「okuri.html」を作る＞

●<FORM>タグの形式

●<FORM>タグに設定する主な属性（p399_1）

●<INPUT>タグ

●書式⇒<INPUT>タグの形式

・INPUTタグに設定できる主な属性

・タイプ属性の設定

●INPUTタグを使った例

（７－３）＜データを受信して表示する「uke.php」を作る＞

●書式⇒METHOD="POST"で送信されてきたデータが入る変数

●書式⇒｢NAME="a"｣のテキストボックスの値を受け取る変数$_POST["a"]

（７－４）＜データを送信し受信する＞

（８）《POSTとGETによるデータ送信 ｐ０００》

（８－１）＜データ送信の方式「POST」と「GET」＞

●POST送信

●GET送信

（８－２）＜GETメソッドでGET送信を行なう＞

（８－３）＜GETとPOSTの違い＞

●書式⇒GETメソッドでのアドレスバーの表示

（８－４）＜GETメソッドでURLに値を付けて送信してみる＞

（８－５）＜何も宣言せずにデータを送信する＞

＜まとめ＞

＜チェック＞

＜練習問題＞

《解答1》

【実行結果】

（１）《ＨＴＭＬソース　ｐ０００》

（２）《Ｗｅｂページを生成する２つの方法　ｐ０００》

（３）《ＨＴＭＬの規則　ｐ０００》

（４）《ＨＴＭＬファイルをＰＨＰスクリプトで書き出す　ｐ０００》

（５）《さらに覚えておきたいタグ　ｐ０００》

（７）《ブラウザからＰＨＰでデータを送信する　ｐ３９６》

（８）《POSTとGETによるデータ送信　ｐ０００》