LogoMark.png

PHP/Sample01 の変更点


#author("2021-09-25T11:23:10+09:00;2020-02-02T17:52:12+09:00","default:inoue.ko","inoue.ko")
*PHP Sample Code
Echo back / Form Action / Send E-Mail
~

PHPの動作を簡単に理解するためのサンプルを以下に紹介します。ソースコード中の命令や関数の詳細については[[PHPマニュアル>http://www.php.net/manual/ja/index.php]]でご確認下さい。
 PHPはサーバーサイドのスクリプトなので、ブラウザで直接開いても動作しません。ソースをコピーして試してみたい場合は、ファイルをサーバーにアップしてからお試し下さい。ローカルにある[[XAMPP>Google:XAMPP]]等で試す場合は、ドキュメントルート(htdocsフォルダ)に置きましょう。''え?'' という方は[[「そもそもPHPとは何か」>PHP]]のページに戻ってご確認下さい。

#contents2_1
#hr
~


***事例1:最も基本的な文字列表示です。

-DEMO:https://design.kyusan-u.ac.jp/SampleSite/PHP01/
-CODE:https://github.com/koichi-inoue/PHP_Sample01

ページが表示されたら、ブラウザでページのソースを見てみて下さい。上のソースとは違うものが見えるはずです。これはソースコードの <?php から ?> の間が処理されて、そこに日時やサーバーのPHPの情報がHTML形式で埋め込まれたためです。
 このようにPHPの場合、ブラウザの「ソースを表示」で見えるのは、元のソースではなく、処理された結果としてブラウザに送られたHTMLです。
~
~

***事例2:数字だけのサイコロ(PHPとJSの比較)

-DEMO:https://design.kyusan-u.ac.jp/SampleSite/PHP02/

ランダムに数字を変えて表示するプログラムを2つ、ひとつはPHP、もうひとつはJavaScript、比較のために紹介しています。
 どちらも動的にHTMLを書き換えますが、前者(PHPバージョン)はリロード(再読み込み)時にサーバーサイドで処理され、後者(JavaScriptバージョン)はボタンクリックイベント時にクライアントサイドで処理されます。

''index.php''  ← 拡張子PHPです。「再読み込み」でサイコロが振られます。

 <!DOCTYPE html>
 <html lang="ja">
 
     <head>
         <meta charset="utf-8">
         <title>SAMPLE</title>
         <style type="text/css">	
             #dice { font-size:48px; }
         </style>
     </head>
 
     <body>
         <p>Sample with PHP</p>
         <div id="dice" >
             <?php echo rand(1,6); ?>
         </div>
     </body>
 
 </html>
 

''index.html''  ← こちらは拡張子 HTML 。JavaScript で作った例です。

  <!DOCTYPE html>
  <html lang="ja">
 
      <head>
 
         <meta charset="utf-8">
         <title>SAMPLE</title>
 
          <style type="text/css">	
             #dice { font-size:48px; }
         </style>
 
         <script type="text/javascript"> 
             window.onload = function(){
                 var btn = document.getElementById("btn");
                 btn.addEventListener("click", reset, false);
             }
             function reset(){ 
                 var content = document.getElementById("dice") 
                 content.innerHTML = Math.floor(Math.random() * 6) + 1;
             } 
         </script> 
 
     </head>
     
     <body>
         <p>Sample with JavaScript</p>
         <div id="dice">
             6
         </div>	
         <input id="btn" type="button" value="click">
     </body>
 
 </html>

本当はもっと短く書けます。ただ、本来、HTML、CSS、JavaScript は分離すべきなので、その雰囲気が見えやすいような書き方をしています。実際には、ビジュアル(CSS)や振る舞い(JavaScript)に関する事は、それぞれ別ファイルにして、ヘッダーで読み込む。すなわち、あくまで ID や CLASS を使って外からコントロールする…というのが理想のスタイルです。
~
~

***事例3:送信したメッセージをそのまま返します。

-DEMO:https://design.kyusan-u.ac.jp/SampleSite/PHP03/
-CODE:https://github.com/koichi-inoue/PHP_Sample03


-''index.html''  ←拡張子HTMLです。これはふつうのHTML
一番重要な部分は、action = "./response.php"  method ="POST" という部分です。これは、「データを送信するので、response.php で処理して下さい」という意味です。このとき、具体的なデータは message="(入力されたメッセージ)" というかたちで送信されます。
~

-''response.php''  ←拡張子PHPです。上のフォームに呼ばれて動きます。
message="(入力されたメッセージ)" というかたちで受け取ったデータを、そのまま表示(エコーバック)します。$_POST['message'] は、定義済みの特殊な変数で、送信されたデータの中にある message を意味します。
~
~

***事例4:メール送信フォームです。
//[[→DEMO フォームからメールを送信します。>https://design.kyusan-u.ac.jp/PHP_SEND_MAIL/]]
宛先メールアドレス、タイトル、本文、そして送信者のメールアドレスの4項目を入力して、メールを送信するフォームです。このフォームは宛先欄に入力されたアドレスへメールを送信するというもので、あくまで、プログラムの書き方の事例としてご覧下さい(普通の「お問い合わせフォーム」の場合、宛先はサイトの運営側へ固定されます)。公の場に置くと様々なイタズラのもとになりますので、&color(red){DEMOは、授業中のみ機能させます。};
~

''index.html''  ←拡張子HTMLです。これはふつうのHTML

 <!DOCTYPE html>
 <html lang="ja">
 
   <head>
     <meta charset="utf-8">
     <title>SEND MAIL</title>
   </head>
 
   <body>
     <p><b>SEND MAIL Sample</b></p>
     <hr>
     <form action="./email.php" method="POST">
       <dl>
         <dt>To :</dt>
         <dd><input type="text" name="email" id="email" size="50" maxlength="255"></dd>
         <dt>SUBJECT : </dt>
         <dd><input type="text" name="subject" id="subject" size="50" maxlength="255"></dd>
         <dt>MESSAGE : </dt>
         <dd><textarea name="message" id="message" cols="50" rows="8"></textarea></dd>
         <dt>Your Email : </dt>
         <dd><input type="text" name="senderEmail" id="senderEmail" size="50" maxlength="255"></dd>
       </dl>
       <input type="submit" value="SEND MAIL">
     </form>
   </body>
 
 </html>

事例3と同様、action = "./email.php" により、送信ボタンを押すとemail.php が呼ばれて動作します。
~

''email.php''  ←拡張子PHPです。上のフォームに呼ばれて動きます。

 <!DOCTYPE html>
 <html lang="ja">
 
   <head>
     <meta charset="utf-8">
     <title>SEND MAIL|Responce</title>
   </head>
 
   <body>
     <p><b>SEND MAIL |Responce</b></p>
     <hr>
 
     <?php
       mb_language("japanese");
       mb_internal_encoding("UTF-8");
 
       if(!empty($_POST['email']) && !empty($_POST['senderEmail'])){
         $to = $_POST['email'];
         $subject =$_POST['subject'];
         $body = $_POST['message'];
         $from = $_POST['senderEmail'];
         $success = mb_send_mail($to, $subject, $body, "From:".$from);
       }else{
         $success = FALSE;
         print('メールアドレスを入力して下さい。<br>');
       }
     ?>
 
     <?php
       if($success){
         print('送信に成功しました。');
       }else{
         print('送信に失敗しました。');
       }
     ?>
   </body>
 
 </html>

実際にメールの送信を行っているのは、mb_send_mail関数です。mb_ではじまるマルチバイト文字操作関数(mb : Multi Byte)は、日本語を含む文字列を正しく処理するためのものです。
 尚、このプログラムが動作するためには、メールサーバーが動作している必要があります。XAMPPにはそれがありませんが、学園のサーバーにアップすれば動作確認可能です。

''備考'':フォームを用いたメール送信一般に言えることですが、フォームに入力される「From : メールアドレス」というのは、投稿者の単なる自己申告にすぎません。受信者側での簡易表示を見ても、実際の送信(投稿)をどこから行われたかは詳細に表示されないため、様々なイタズラを誘発する可能性があり、その点、注意が必要です。
 ちなみに、送られたメールのソース(詳細な情報)には、mb_send_mail()を実行したサーバーの情報、つまりあなたがファイルを設置したサーバーが実際の送信元として記載されています。


''備考2'':偽装メールの見分け方
上記のように、Fromヘッダーの情報は詐称が可能です。これは上記のようなプログラムによって可能なのです。不審なメールが届いたら(From がちゃんとした企業のものになっているが、内容が怪しい )、メールの「ソース」を開いて、Receivedヘッダー情報を確認してみて下さい。From とは異なるドメインになっている場合は、詐欺とみなせます。

~

***補足:mailto アクション
宛先が決まっている「お問い合わせフォーム」の場合、HTMLのみでも目的は達成されます。
 ただし、この方法では、[submit]をクリックすると、ブラウザからメールソフトが起動して、実際の送信はメールソフトの[送信]によって行うので、ユーザにとっては、気持ちのいい動作ではありません。
 <form action="mailto:xxxx@xxxxx.com"  method="post" enctype="text/plain">
   <dl>
     <dt>SUBJECT:</dt>
     <dd><input name="subject"></dd>
     <dt>MESSAGE:</dt>
     <dd><textarea name="message" cols="50" rows="5"></textarea></dd>
   </dl>
   <input type="submit" value="submit">
 </form>
~
~