Happy people roll with the punches.  They know from experience that everything changes.  Today’s good fortune may vanish tomorrow, today’s crises may turn out to be tomorrow’s good fortune. – Unknown

The winners in life think constantly in terms of “I can, I will, I am”. Losers, on the other hand, concentrate their waking thoughts on what they should have done or on what they don’t do. – Denis Waitley

The worst bankrupt in the world is the man who has lost his enthusiasm. Let a man lose everything else in the world but his enthusiasm and he will come through again to success. – H. W. Arnold

Why study PHP? 何故PHPなのか その2

まずは前回の復習 (Internet上のページがどのようにつくられているか、門外漢向けの説明、と同時に自分が理解したと思った内容の復習です)

  1. Internet のWeb home  Page上の情報 は HTMLという言語で記述されている。
  2. 表示の加飾方法(内容ではなく)についてはCSSというファイルに記述され、これがHTMLを記述したファイルから参照されている。
  3. これをブラウザが読み込んで人間たちが読めるように表示する。
  4. HTMLとCSSで構成されたweb Pageは静的なページで閲覧者のアクションに対して動的なページにするにはスクリプト言語を追加する必要がある。
  5. スクリプトにはブラウザー側で動くスクリプトとサーバー側で動くスクリプトがある。

 

と言うところまで説明しました。 今日はここから

ここで言っているサーバーの意味を簡単に言うと世界のどこかにある、Internetでホームページを発信しているコンピューターのこと。 スクリプトがサーバーで実行される場合は、閲覧者のコンピューターに届くときにはごく普通のHTMLファイルになっています。 ブラウザーからはサーバー側でどのような作業がされたのかを見ることはできません。 これの代表的な言語がPHPです。(マイクロソフトのExpress WebやVisual StudioでWebアプリケーションを作っている場合はNET.ASPという言語がサーバー側で動き、アプリケーション(aspxファイル)を処理してhtmlとCSS、VBscriptなどに吐き出してブラウザー側に送っています。)

Client 側とは 閲覧者が使っているブラウザーです。 ブラウザー側で動くスクリプトはHTMLに”このスクリプトを使ってね“という記述があって、 それをブラウザーが実行します。代表的なスクリプト言語にはJavaScriptがあります。VBScriptなどもそうです。 JavaScriptを使うと、dropdownやflyoutのメニューなどや、単語にカーソルを当てると、それに対応したイメージを表示させるような仕組み、フェードイン、フェードアウトのようなアニメーションをページに組み込むことができます。すなわちスクリプトの内容もブラウザー側に送られてきます。 ちなみにこのスクリプトの内容はIE8のような新しいブラウザーでは開発モードにすると(F12を押す)見ることができます。

Server side Scripting, Client side Scripting, それぞれ得手不得手があるので同じページに両方使うことも普通に行われます。

Server side scripting はサーバーがPHPやASP.netなどの環境をサポートしている必要があります。 有料のプロバイダーはほとんどの場合PHPをサポートしていますが、 無料サービスのホストの中にはサポートしていないこともあり、 そのようなHostを使っているときには、プロバイダーが用意したページ作成ソフトで画面を作るか、 HTML,CSS, JavaScriptの三種の神器のみでページ作成に取り組むことになります。

ここで自分がどうしてこのような事に興味を持ったのか、その理由を書いておきます。

インターネットサービスのプロバイダーと契約をしたときに、メールアカウントの他に、HomePageのスペースも頂きました。 15年も前の話です。 当時はwindows 95にFrontpage Expressというhome page 作成用のツールがついてきましたが、 今にして思うと、これは簡単なHTML生成のソフトでした。  このツールだけでも当時としてはそれなりのページが作れましたのでなんとなく満足していましたが、そのうちプロバイダーがWebPageBuilderというブラウザ上で簡単にhomepageを作れるツールを提供するようになりました。 これはテーマを選ぶと、それなりのページが作れ、メニューも自動生成される、というものでした。 それからというもの、内容の編集はすべてWEB上のツールで行いました。 しかし、それだとどうしても出来るページ、構成は定型なものになってしまいます。

私の場合、最初はHTMLだけで簡単なhomepageを作っていました。 そのうち、他の方たちのページを見て、見出し部分がしっかりトップにあり、メニューが左側に配置され、 その右側に本文が並べられているような作りはどうやって実現するのだろうと興味を覚えCSSを覚えることになりました。

さらに簡単なアニメーションとかも入れたくてJavaScriptも少し勉強しました。 JavaScriptの場合、Internetに色々なコードが開示されていたり、さらにJQuery というswiss army knifeのようなツールがあって、 かなり高度なこともそれほど深い知識が無くてもホームページ上で使えるようになります。

これだけでわりと「らしい」ページを作れるようになったのですが その次に困ったのが「すべてのページ共通な部分をいちいち コピーペーストで複製していかなくてはいけない」 ということでした。

特にメニュー関係の項目は メニューを増やすごとにすべてのページを編集しなければなりません。 これはもっと良い方法があるはずだ、と思ったのです。

調べてみると、サーバーサイドインクルード(SSI)という仕組みがあって、HTMLの記述に 「このファイルを含むのよ」 と書き込んで 別ファイルにメニューの記述を書いておけばこの別ファイルを変更するだけで このファイルを参照しているすべてのHTMLページに反映される、ということができるらしい、という事がわかりました。 ただし、この機能はサーバーがサポートしている必要があります。 

SSIと同じことは PHPでもできます。同じ事はJavaScriptでも出来るのですが、 PHPでは 一行のコード  ですむところをJavaScriptではそれなりのコーディングが必要になります。 なぜかというと、 PHPの場合はサーバー側で処理を行い、 ブラウザーが受け取るHTMLは既にインクルードされるべき内容が反映されたものになっていますが、JavaScriptで行う場合はまずはJavaScriptを含んだHTMLをブラウザ側で読み込み、次にJavaScriptの指示に従って、インクルードするべき内容をサーバーに取りに行き、これをHTML内部に埋め込むという作業を行った後で、整形されたHTMLをブラウザーが再度表示する、というような作業を行うからです。 JavaScriptでやるのはスマートではないなあ、と思い、PHPに興味が沸きました。 

一昔前のWebの教科書を見ると、Server Side Scripting はPerlという言語を使っています。 PHPというのはここ10年ほどで急速に認められてきた言語体系のようです。

さらに調べてみると、 WordPress ,Drupal, Joomla!など今話題のWebコンテントのマネージメントツールや、facebook,WikipediaなどのWeb serviceは皆PHPを使って作成されているようです。  これはかじってみるしかありますまい。 と思うに至り PHPの勉強をすることにした次第。

ModXのテンプレート変数(Template Variable, or TV)のすごさが判ってきた

 

とにかく実際に試してみる、とういのが物事なんでも大事なようで、オンラインのチュートリアルでわかったようなつもりになっていても、 実際に経験してみてその効果が実感できるということがよくわかったのが、このModXのTVの使い方

その1: 新しいページを作成してそこに表示するメニューをまったく別の親からはじめようと思ったのだが、メニュー部分はテンプレートに入っている。 テンプレートに新規のものを指定することももちろん出来るわけだが、今回はメニュー用Snippetのwayfinder のstartidの指定部分を`20`という固定から menurootというTVを作って`*menuroot`という変数指定とし、default値を20とすることで、従来のページには影響を与えず、新規のページについては何もしなければデフォルトのメニューを表示、メニューの表示を違う親から始めたければTVの値を指定できるようにして解決。

その2: その新しいページの固定幅を広くしたい必要が生じた。 CSSには .wrapper { width:750px; .. というクラスで指定してあるのだが、 新しく .wrapperWide{ width:1000x;   というクラスを指定し、 テンプレート上の

<div class=”wrapper”…  という部分を <div class=”wrapper[[*narrowOrWide]]….   として narrowOrWide というTVを追加する。   narrowOrWide のデフォルト値は空白なので、 従来のページはそのまま。 新しいページのnarrowOrWideのTV値を”Wide” とすることで解決。 

システムの仕組み上そうなるのが当たり前なのだが、 ページがうまく表示されたときには感動した。

Warning: Cannot modify header information – headers already sent by

新しいサイトに Feedback Formを実装して試験をしたらこのエラーに出くわした。 ググってみると結構ヒットする。 

基本的には <?php タグの前に文字列などがあるとこのエラーが出る、という話なのだが、 最初テクストパッドで見ても文字列どころかスペースもなにもない。 他の原因かと思い、推奨されていた バファリングをONにしたりなどしてみたが拉致開かず。 

ところがPSPADエディターをHexモードにして眺めてみると なぜか先頭にFFFEのバイトがくっついている。  

これは一体なんじゃい?  テクストモードだとまったくわからない。 

Watcom Cのエディターを起動し読み込んでみたら、 こちらでは 

<?php

 と出た。 PSPADでも設定を変えると表示できるような気がするが、とにかく、Watcom editor を使ってこのわけのわからんゴミを削除し、サイトにアップロードしなおしてトライしたところ解決! (さきほどNetBeansのIDEでも表示が出る事を確認) 無為に使った時間の総計約3時間

 
そこで FFFE at the beginning of Text file でググってみたら、  Wikipedia 上の Byte Order markという記述にたどりついた。NotepadなどのWindowsのエディターはデフォルトでこれがくっつくんだそうな。 説明はそちらにゆずるとして、  PHPで不具合が出ますよ、と、どんぴしゃのことがしっかり書いてある。 これで半日つぶしたぞ! 
 
PS: フラッシュを埋め込んだページのいくつかに、このが表示される理由がわからなかったのだが、 これでなんとなく察しがついた。 埋め込みに使ったテンプレートファイルを眺めてみることにしよう。
 
 
 in my case, it was the Byte order Mark that was appended to the beggining of the PHP file.  For detail discussion, see Wikipdia entry “byte order Mark”  It even talks about this particular  PHP error.