スライド 1

Size: px

Start display at page:

Download "スライド 1"

ゆずさふじた
7 years ago
Views:

1 1

2 ブラウザソフト HTML 言語画像群プログラムはテキストエディタで作成します 2

3 Webプログラミング体験仮想ネットワーク ADSL 回線 Webサーバ DHCPサーバ DNSサーバ SAMBAサーバメールサーバ ~40 スイッチングHUB(16ポート) 10BASE/100BASE 対応 MDI/MDI-X 自動認識機能付き BBルータグループ1 Webサーバカスケード接続グループ2 Webページを参照する場合のURLは以下の通りです 3

100 192.168.100.20~40 スイッチングHUB(16ポート) 10BASE/100BASE 対応

4 ホームページ作成ツールからHTMLプログラミングに脱皮しませんかアニメーションGIFやプラグインで動きのあるページは作れますが結局は一方通行 ( 見るだけ)のページでしかありません HTMLにJavaScriptを組み込むことにより簡単なゲームソフトやインタラクティブなWebページを作成してみませんか操作者の意図による Web 画面のダイナミックな切り替えができますインタラクティブ動作 ( 対話 )はクライアントの世界に限定されます閲覧や遊び目的のWebページから自前のサーバや安価なレンタルサーバなどを使って仕事で使えるWebページ(グループウェア)へと脱皮してみませんかインターネット上でのインタラクティブ動作 ( 対話型 )やグローバルな情報の共有化ができます個人のWebページも Webサーバやデータベースを活用すれば一味も二味も違うものとなります自分だけのオリジナルなカウンタが簡単に作れます世界中の何処からでもどのコンピュータを使ってでも自分の情報を参照 / 更新できますデータベースとWebページを連携させればデータベースの内容がそのままWebページに反映されます掲示板などのように情報の共有化がグローバルに実現できます 4 補足 1:ホームページとはサイトが公開している先頭のページの名称で Webページはブラウザ画面に表示される全てのページの総称です補足 2:インタラクティブなWebページとはオンラインショップなどで見られるオペレータとの対話ができるWebページを指します

話型 )やグローバルな情報の共有化ができます個人のWebページも Webサーバやデータベースを活用すれば一味も二味も違うものとなります 1 2 3 4 自分だけのオリジナルなカウンタが簡単に作れます世界中の何処からでもどのコンピュータを使ってでも自分の情報を参照 / 更新できます

5 ドメイン名とIPアドレススキーム名サービスの種類を表しますポート番号はスキーム名に登録された番号となります 5

6 ルートサーバ所在地とドメイン名を変換する仕組みルートサーバの所在地 6

7 ネットワーク通信には IPアドレスとMACアドレスが必要通信を行う相手のプログラムに付けられる番号で予め決められた番号とダイナミックに取得できる番号があります例 : Webサーバソフト 80 番 FTPサーバソフト 20 番メールサーバソフト 25 番 IP Netmask MACドレス xx:xx:xx:yy:yy:yy IP Netmask MACドレス xx:xx:xx:yy:yy:yy 通信を行う相手の機器に対してユニークな番号で設定される論理的な番号で 32ビット(IPv4) 仕様と 128ビット(IPv6) 仕様がありますまたインターネット接続時に使われるグローバルIPアドレスと閉じたネットワークで使われるプライベイトIPアドレスがあります例 : IP Netmask MACドレス xx:xx:xx:yy:yy:yy スイッチングHUB IP Netmask MACドレス xx:xx:xx:yy:yy:yy 通信を行うハードウェアに設定される 48ビット構成の世界でユニークな番号で製造時に設定されます通信処理プログラムは最終的には IPアドレスからMACアドレスを変換して相手と通信を行います例 : 00:12:11:0E:01:03 実際のIPアドレスからMACアドレスへの変換は通信したい相手のIPアドレスをネットワーク上に送出しそのIPアドレスを持っている機器が自分のMACアドレスを返却する方法で行われます 7 IPアドレスとNetmaskに設定された値でANDを行った結果がネットワークアドレスを表しますまたホストアドレスの最大がブロードキャスト用となります

255.255.0 MACドレス xx:xx:xx:yy:yy:yy 通信を行う相手の機器に対してユニークな番号で設定される論理的な番号で 32ビット(IPv4) 仕様と 128ビット(IPv6) 仕様がありますまたインターネット接続時に使われるグローバルIPアドレスと閉じたネットワークで使われるプライベ

8 MACアドレスとIPアドレス MACは世界で一つの番号 IPアドレスには世界で一つのグローバルアドレスと勝手に使えるローカルアドレスがあります新しいIPアドレス体系 (IP v6)にはこの制約はありません 8

9 IPv4におけるIPアドレスの設定規則クラスCでネットマスクがの場合 9

10 1 ブラウザ (ポート番号 : >1023) アプリケーション層 ( 第 7 層 :アプリケーション層第 6 層 :プレゼンテーション層第 5 層 :セッション層 ) 2 Webサーバ (ポート番号 :80) TCP/UDP IP 送信側ポート番号は1024 以上宛先ポート番号は規定されたポート番号として下位層に渡される上位層から受け取ったデータを隣接端末と通信する為のサイズに分割して下位層に渡される隣接端末に対する確実な送信処理が行われる伝送制御手順宛先ポート番号で指定されたアプリケーションにデータを渡す通信回線の都合で分割されたデータを再構築 (セグメント化 )して上位層に渡す隣接端末からのフレームデータを上位層に渡す隣接端末からのデータを確実に受信する TCPは最終相手先とのセグメント単位での受け渡し確認処理を行うが UDPは行わない宛先 IPアドレスで指定された回線にデータを送出する ( 回線に合ったサイズ分割も行う) 隣接端末間の確実なデータ通信を行う ( 隣接する端末間の通信回線の規格化が行われている) ルーターインターネット層トランスポート層 ( 第 4 層 :トランスポート層 ) インターネット層 ( 第 3 層 :ネットワーク層 ) ネットワークインターフェース層 ( 第 2 層 :データリンク層第 1 層 : 物理層 ) 別相手先ルーターインターネット層送信側ポート番号を80 番に設定し受信データに添付されていた宛先ポート番号を宛先ポート番号に設定し下位層に渡される TCP/UDP IP 上位層から受け取ったデータを隣接端末と通信する為のサイズに分割して下位層に渡される隣接端末に対する確実な送信処理が行われる伝送制御手順宛先ポート番号で指定されたアプリケーションにデータを渡す通信回線の都合で分割されたデータを再構築 (セグメント化 )して上位層に渡す隣接端末からのフレームデータを上位層に渡す隣接端末から確実なデータ受信を行う ( ):OSI7 階層による規定ネットワークインターフェース層ルータは宛先 IPアドレスにより通信経路を決定するまた通信回線に応じてフレームに分割 / 構築を行うネットワークインターフェース層別相手先 10

化 )して上位層に渡す隣接端末からのフレームデータを上位層に渡す隣接端末からのデータを確実に受信する TCPは最終相手先とのセグメント単位での受け渡し確認処理を行うが UDPは行わない宛先 IPアドレスで指定された回線にデータを送出する ( 回線に合ったサイズ

11 この仕組みが分かればネットワークは分かる PT1(ブラウザ) IP1 MC1 PT2(Webサーバ) IP6 MC6 ( 上位 ) プロトコルの階層 ( 下位 ) データ1 データ1 データ1 物理層データ PT1 PT2 PT1 PT2 PT1 PT2 IP1 IP6 IP1 IP6 MC1 MC2 アプリケーション層プレゼンテーション層セッション層データn PT1 隣接機器との通信形態に応じたデータ分割と両末端のポート番号 (ソフト番号 )の付加両末端のIPアドレスの付加及び必要時における伝送手順に応じたデータ再分割隣接する機器のMACアドレスを付加 (IPアドレスより変換 ) トランスポート層 (TCP etc) ネットワーク層 (IPv4 etc) データリンク層 (CSMA/CD etc) ネットワーク上の各通信ユニットは回線上に流れるデータを監視し自分宛のデータであれば上位のプロトコルに渡します ( 上位 ) プロトコルの階層 ( 下位 ) データ1 データ1 データ1 物理層データ PT1 PT2 PT1 PT2 IP1 IP6 アプリケーション層プレゼンテーション層セッション層データn ポート情報の削除と分割データの再構築及び上位プロトコルへのデータの受け渡し IP 情報の削除と分割データの再構築と上位プロトコルへのデータに受け渡し MACアドレスの削除と上位プロトコルへのデータの受け渡し (スイッチングHUBはデータ上のMACアドレスを見てその相手だけに信号を流します) IP2 MC2 ルータ IP3 MC3 データ1 PT1 PT2 IP1 IP6 MC3 MC4 IPアドレスとルータに設定されたルーティングテーブルから相手のMACアドレスを得てヘッダーに付加次のルータは相手先 IP アドレスとルーティングテーブルで確定されます伝送路によって一回で通信できるデータ長は異なります MACアドレスは中継ごとに書き換わります IP4 MAC4 IP5 MC5 データ1 PT1 PT2 IP1 IP6 MC5 MC6 IPアドレスとルータに設定されたルーティングテーブルから相手のMACアドレスを得てヘッダーに付加注 :PT1,IP1 MC1はそれぞれ送信先のポート番号 IPアドレスおよびMACアドレスを示していますルータには受信用と送信用のプロトコル( 物理層からネットワーク層まで)が内蔵されておりリンクバイリンク方式でデータが受け渡されて行きますルータ 11

ネットワーク層 (IPv4 etc) データリンク層 (CSMA/CD etc) ネットワーク上の各通信ユニットは回線上に流れるデータを監視し自分宛のデータであれば上位のプロトコルに渡します ( 上位 ) プロトコルの階層 ( 下位 ) データ1 データ1 データ1 物理層データ PT1 PT2 PT1 PT2

12 TCPヘッダーとIPヘッダー TCPヘッダー IPヘッダー 12

13 イーサネットヘッダー 13

14 ベースバンドによる伝送符号方式 ISDN, 及びディジタル交換網 (AMI 符号方式とも言う) 光ファイバー及び高速ディジタル通信同軸ケーブル及び EthernetLAN 14

GIF,JPEG,PND 形式 Mpeg,qt,mid,wma,, 形式 HTMLは必要なプラグイン機能

15 HTML HyperTextMarkupLanguage HTMLは表示する文字カラー表示方法などを定義します HTMLは何処に何をどのように描画するかを定義します GIF,JPEG,PND 形式 Mpeg,qt,mid,wma,, 形式 HTMLは必要なプラグイン機能を定義します動画や音声などを扱うプログラムなどはブラウザに組み込まれて(プラグイン) 動作します 15

16 HTML 言語は画面に何を表示するかを定義する言語であり入力条件などで処理の内容を変えることはできません HTML 言語は対話画面は作れますが入力された内容をチェックしたり入力内容に応じて処理を変えるなどの処理はできません入力内容をチェックしたり入力内容により処理を変えたい場合はクライアント側で動作可能なJavaSCript 言語を併用して使います HTML 言語で書かれたプログラムはブラウザソフトがなければ解釈表示することはできません HTMLプログラム PHPプログラム及び参照する画像は以下のディレクトリに保存します /var/www/html HTMLプログラムは以下の URLで実行します HTML 言語画像群ブラウザソフト注 : 画像の保存場所やプログラムの保存場所は任意に決めることができます CGIプログラム及び参照する画像は以下のディレクトリに保存します /var/www/cgi-bin URLは以下のように指定しますプログラムはテキストエディタで作成します CGIプログラムは以下のURLで実行します WebサーバのIPアドレスをとした場合の例ですブラウザソフトとはお客様の要求を解釈してサーバに適切な形式で要求を行ったりサーバから送られたデータを解釈してその内容を画面に表示してくれるものです 16 ブラウザソフトはプログラムや画像を外部記憶装置から読み込んで表示することもインターネット上 (LAN 上 )のWebサーバーと交信を行ってWebサーバ上のプログラムや画像を読み込み表示することもできます

HTMLプログラムは以下の URLで実行します http://192.168.0.100/xxx.

17 1 3 テキストエディタ (Terapad,Notepadなど) 2 4 プログラム補足 : FTPサーバ Telnetサーバ SSHサーバなどなどは無料で手に入れることができるソフトウェアです 5 画像編集ツール (PhotEditor,Paint フリーの動画作成ツールなど) 6 画像ファイル転送ツール (FFFTP WinSCPなど) 7 8 プログラム+ 画像など FTPサーバー (Vsftpdなど) プログラム画像 9 遠隔操作ツール (Telnet,SSH など) 10 サーバーマシーンの遠隔操作 Telnet/SSHサーバ (Telnetd,sshdなど) 11 補足 : 番号は処理の流れを表しています補足 :ツールは様々ですが自分に合ったツールを選択してそのツールの最小限の操作だけを覚えれば十分です 17

FTPサーバー (Vsftpdなど) プログラム画像 9 遠隔操作ツール (Telnet,SSH など) 10 サーバーマシーンの遠隔操作 Telnet/SSHサーバ

18 補足 : Webサーバ PHPスクリプト及びブラウザソフトは無料で手に入れることができるソフトウェアです Webサーバー (Apacheなど) プログラム 1 9 ブラウザソフト (IE,NetScape,など) HTML+ 画像など Webサーバー (Apacheなど) 7 5 画像 4 リンクにより行われるページの切り替えはブラウザにより内部的に新たなURL 要求が発行されます (1 回目と同じ) WebページはクライアントからのURL 要求毎に新しいWebサーバを起動しその URLに対してプログラムや画像を送り終ると自動的に終了しますスクリプト Webプログラムがサーバ側で実行されるスクリプトタイプである場合は Webサーバー上で( 同じプロセスとして) 実行されその結果だけがクライアント側に返却されます WebプログラムがCGIタイプである場合は CGIプログラムは新しいプロセスとして起動されその実行結果だけがクライアント側に返却されます情報補足 : 番号は処理の流れを表しています 6 CGI (Perl,Java,Cなどで作成 ) 18

URLに対してプログラムや画像を送り終ると自動的に終了しますスクリプト 6 7 5 Webプログラムがサーバ側で実行されるスクリプトタイプである場合は Webサーバー上で( 同じプロセスとして) 実行されその結果だけがクライアント側

19 補足 : データベースサーバ(PostgreSqlなど)は無料で手に入れることができるソフトウェアです Webサーバー (Apacheなど) プログラム 1 13 ブラウザソフト (IE,NetScape,など) Webサーバは直接データベースをアクセスすることはしませんデータベースアクセスはスクリプトタイプのプログラムかCGIタイプのプログラムから行われクライアント側からのデータベース参照用であればその要求に従って処理を行った結果のみがクライアント側に返却されますスクリプトプログラムやCGIプログラムで作成されるものとしてカウンターや掲示板などがありますサーバ上のスクリプトプログラムやCGIプログラムが作成できれば Webを使った業務ソフトは簡単に作れますデータベースは業務そのものです HTML 11 画像などの要求 12 画像など補足 : 番号は処理の流れを表しています Webサーバー (Apacheなど) 5 9 スクリプト (PHPで作成 ) 8 6 CGI (Perl,Java,Cなどで作成 ) 8 DBMS (Postgresql,Mysqlなど) 画像情報 19

作成されるものとしてカウンターや掲示板などがありますサーバ上のスクリプトプログラムやCGIプログラムが作成できれば Webを使った業務ソフトは簡単に作れますデータベースは業務そのものです 2 3 10 HTML 11 画像などの要求 12

20 <HTML> <HEAD> <TITLE> 初めてのWebプログラミング </TITLE> </HEAD> <BODY bgcolor="blue"> <CENTER> <FONT size="6" color="red"> <BR> <B> 初めてのWebプログラミングです</B> <BR> <BR> </FONT> </CENTER> <DIV align="center"> <A href="test2.htm"> <IMG src="test1.jpg" width="256" > </A> <H4> 画像をクリックするとページが変わります</H4> </DIV> <MARQUEE behavior="scroll"> <FONT size="6" color="white"> <BR> HTMLでのプログラミングは初めてですけど意外と簡単でした </FONT> </MARQUEE> </BODY> </HTML> <HTML> <HEAD> <TITLE> 初めてのWebプログラミング </TITLE> </HEAD> <BODY bgcolor="blue"> <CENTER> <FONT size="6" color="red"> <BR> <B>2ページ目のページです</B> <BR> <BR> </FONT> </CENTER> <DIV align="center"> <A href="test1.htm"> <IMG src="test2.jpg" width="256"> </A> <H4> 画像をクリックすると最初のページに戻ります</H4> </DIV> <MARQUEE behavior="scroll"> <FONT size="6" color="white"> <BR>HTMLでページを切り替えるのは本当に簡単ですこれならHTMLでホームページを作れそうです </FONT> </MARQUEE> </BODY> </HTML> 実行前に 300x300 程度の画像を2 枚作成して test1.jpg test2.jpgという名前で登録しておいてください 20

jpg" width="256" > </A> <H4> 画像をクリックするとページが変わります</H4> </DIV> <MARQUEE behavior="scroll"> <FONT size="6" color="white"> <BR> HTMLでのプログラミングは初めてですけど意外と簡単でした </FONT> </MARQUEE> </BODY>

21 wma: 音楽 / 動画ファイル swf:flash 形式動画ファイル wmv: 音楽 / 動画ファイル <HTML> <BODY> <CENTER> <EMBED src= asunaro.wma" autostart="true" hidden="true" loop="true" ></EMBED> <object classid="clsid:d27cdb6e-ae6d-11cf-96b " codebase=" abs/flash/swflash.cab#version=4,0,0,0" width=300 height=300> <param name=movie value="slide.swf"> <param name=quality value=high> <embed src="slide.swf" quality=high width=300 height=300 type="application/x-shockwave-flash" pluginspage=" /index.cgi?p1_prod_version=shockwaveflash"> </embed> </object> <BR> <EMBED src="sample01.wmv" autostart="true" hidden="false" loop="true" width="300" height="300" ></EMBED> </CENTER> </BODY> </HTML> OBJECT タグは画像他の文書アプレットなどのオブジェクトを文書内に埋め込むためのタグで IMG IFRAME EMBEDなどの代わりに使用できる汎用タグです EMBEDとははめ込むという意味を持つタグです 21 実行前にツールを使って SWFファイルとwmvファイルを作成し slide.swf sample01.wmvという名前で登録しておいてください

22 <HTML> <HEAD> <TITLE> 初めてのWebプログラミング </TITLE> </HEAD> <BODY bgcolor="blue"> <CENTER> <FONT size="6" color="red"> <BR> <B> 初めてのJavaScriptプログラミングです</B> <BR><BR> </FONT> </CENTER> <SCRIPT language="javascript">  </SCRIPT> <FORM> <CENTER> <INPUT type="button" value=" 画像 1に切り替え" onclick="imgchange('test1.jpg')"> <INPUT type="button" value=" 画像 2に切り替え" onclick="imgchange('test2.jpg')"> </CENTER> </FORM> <DIV align="center"> <A onmouseover="imgchange('test2.jpg')" onmouseout="imgchange('test1.jpg')"> <IMG src="test1.jpg" width="256" name="imgarea"> </A> <H4> 画像切り替えボタンで画像が変わります</H4> </DIV> <MARQUEE behavior="scroll"> <FONT size="6" color="white"> HTMLにJavaScriptを併用するのは意外と簡単でした </FONT> </MARQUEE> </BODY> </HTML> test1.htm 及びtest2.htmで使用した画像を使用します 22

23 <HTML> <HEAD> <TITLE> ユーアイテクノケアのサンプルソフトです </TITLE> <META name="author" content=" 油井正明 "> </HEAD> <BODY bgcolor="white" topmargin="100"> <SCRIPT language="javascript">  </SCRIPT> if ((InData1==InData2) (InData2==InData3) (InData1==InData3)){ alert(" 惜しかったですね ^o^; "); ImgEnd(image){ RepeatFlag=1; 乱数関数を使ったスロットゲーム続きです <CENTER> <A onmouseover="imgchange()" onmouseout="imgend()" href="test4.htm"> <IMG src="image2.jpg" width="80" height="80" border="0" name="myimg"> </A> <IMG src="image1.jpg" width="160" height="160" border="0" name="myimg1"> <IMG src="image1.jpg" width="160" height="160" border="0" name="myimg2"> <IMG src="image1.jpg" width="160" height="160" border="0" name="myimg3"> </CENTER> </BODY> </HTML> 23 実行前に 160x160 程度の画像を10 枚作成して image0.jpg~image10.jpgという名前で登録しておいてください

24 <HTML> <HEAD> <TITLE> JavaScriptサンプル </TITLE> <meta name="keywords" content="dynamic HTML"> </HEAD> <SCRIPT language="javascript">  </script> <BODY bgcolor="white" alink="white" link="white" vlink="white" onload=start()> <DIV > <IMG src="javascript.jpg" width=0 border="0" name="image1" style="position: absolute;left:500px;top:300px;"> </DIV> </BODY> </HTML> javascript.jpg というファイル名で 500x500サイズ程度の画像を作成してください 24

25 <HTML> <TITLE> PHPプログラムのサンプルです </TITLE> <?php $back=$_get['back']; $font=$_get['font']; echo <<<phpend <BODY bgcolor=$back> <CENTER> <FONT size="2" color=$font> 背景色とフォント色をRGB 形式 (#ffffff)で入力してください <FORM method="get" action=phptest.php> 背景色 :<INPUT TYPE="text" NAME="back" size="8" value=$back> フォント色 :<INPUT TYPE="text" NAME="font" size="8" value=$font> <INPUT TYPE="submit" VALUE=" 色の適用 "> </FORM> phpend; If (!empty($_get['back']) or!empty($_get['font'])) printf(" 背景色として%sがフォント色として%sが入力されました ", $_GET['back'],$_GET['font']);?> </FONT> </CENTER> </BODY> </HTML> FFTPによる登録要求 URLによる実行要求実行結果の返送 FTP サーバー Web サーバー PHPプログラム phptest.phpをそのままブラウザソフトで実行してもデータ送信ボタン操作に対する正しい処理は出来ません 25 FTPによりphptest.phpプログラムをサーバーの所定の場所に登録します次に以下のようにURLにてこのプログラムを実行します

26 #!/usr/bin/perl -- print "Context-type: text/html n n"; print "<HTML>"; print "<BODY>"; if (open counterfd, '/usr/tmp/countfile'){ $count=<counterfd>; $count=$count+1; close counterfd; if (open counterfd, '>/usr/tmp/countfile'){ flock(counterfd,2); print counterfd $count; flock(counterfd,8); close counterfd; else{ open counterfd, '>/usr/tmp/countfile'; flock(counterfd,2); print counterfd "1"; flock(counterfd,8); $count=1; close counterfd; print "$count"; print "</BODY></HTML>"; _END_ テキスト型カウンターと画像型カウンターの例です CGIプログラムは Linux 上で実行権をつけること #!/usr/bin/perl -- $img="img1.jpg"; = stat($img); $byte = $data_gif[7]; print "Content-type: image/jpg n"; print "Content-length: $byte n n"; print <IMG>; close(img); _END_ CGItest.htmプログラムは CGItest1.cgiとCGItest2.cgiプログラムを呼び出します CGItest1.cgiプログラムは呼び出された回数を返却します CGItest2.cgiプログラムは img1.jpg という名前で登録されている画像を返却します CGItest.htmプログラムは返却された内容を表示します URLでは以下のURLにより CGItest.htmlプログラムを実行します実行前にimg1.JPG(50x50 程度 )という画像を登録しておいてください FFTPによる登録要求 URLによる実行要求実行結果の返送 FTP サーバー Web サーバー HTMLプログラム CGIプログラム CGIプログラムは /var/www/cgi-bin ディレクトリに登録します <HTML> <HEAD> <TITLE> CGIプログラムの呼び出し </TITLE> </HEAD> <BODY bgcolor="white"> <CENTER> カウンターCGIプログラムの例です <BR> <IFRAME src=" marginheight="1" marginwidth="1" width= 60" height= 30" scrolling="no" > </IFRAME> <BR> <IMG src=" marginheight="1" marginwidth="1" width="100" height="100" scrolling="no" > </CENTER> 26 </BODY> </HTML>

$<?php session_start();?> <HTML> <BODY> <?php $counter=file("counter.txt"); if (empty($_session['enter'])){ $counter[0]++; $fp=fopen("counter.$

27 <?php session_start();?> <HTML> <BODY> <?php $counter=file("counter.txt"); if (empty($_session['enter'])){ $counter[0]++; $fp=fopen("counter.txt","w"); if (flock($fp,lock_ex)){ fwrite($fp,$counter[0]); flock($fp,lock_un); $_SESSION['enter']="entry"; fclose($fp); print sprintf("<b>%05d</b>",$counter[0]);?> </BODY> </HTML> <HTML> <HEAD> <TITLE> CGIプログラムの呼び出し </TITLE> </HEAD> <BODY bgcolor="white"> <IFRAME src=" marginheight="0" marginwidth="1" width=80 height=35 scrolling="no" align=center> </IFRAME> <BR><BR> <IFRAME src=" marginheight="0" marginwidth="1" width=100 height=40 scrolling="no" align=center> </BODY> </HTML> 注 : プログラムの中のはサーバのIPアドレスに置き換えて指定します counter.txt 及びgcounter.txtファイルを作成してサーバに登録後に FFFTツールを使ってこのファイルを書き込み可としますなおこのカウンターは同じブラウザから複数回アクセスしても一回しかカウントアップしません 27

$<?php session_start(); $counter=file( gcounter.txt"); if (!session_is_registered('count')) { session_register('count'); $counter[0]++; $fp=fopen( gcounter.$

28 <?php session_start(); $counter=file( gcounter.txt"); if (!session_is_registered('count')) { session_register('count'); $counter[0]++; $fp=fopen( gcounter.txt","w"); if fclose($fp); (flock($fp,lock_ex)){ fwrite($fp,$counter[0]); flock($fp,lock_un); $count=$counter[0];?> <HTML> <BODY> <?php $keta2=$count/10; $keta2=(int)$keta2; $count%=10; $keta1=$count/1; $keta1=(int)$keta1; echo <<<eof <img src="counter/c$keta2.jpg"><img src="counter/c$keta1.jpg"> eof;?> </BODY> </HTML> 1~10のグラフィック文字を作成してカレントディレクトリ上のcounterディレクトリに c0.jpg~c9.jpgの名前で登録します 28

3 CREATE TABLE 売上明細テーブル ( 伝票番号 INTEGER, 商品コード INTEGER, 個数 INTEGER, PRIMARY KEY( 伝票番号, 商品コード), FOREIGN KEY( 商品コード) REFERENCES 商品テーブル, FOREIGN KEY( 伝票番号 ) REFERENCES 売上テーブル( 伝票

29 3 CREATE TABLE 売上明細テーブル ( 伝票番号 INTEGER, 商品コード INTEGER, 個数 INTEGER, PRIMARY KEY( 伝票番号, 商品コード), FOREIGN KEY( 商品コード) REFERENCES 商品テーブル, FOREIGN KEY( 伝票番号 ) REFERENCES 売上テーブル( 伝票番号 )); 売上 db 1 Createdb 売上 db 2 CREATE TABLE 商品テーブル( 商品コード INTEGER, 商品名 CHAR(30), 単価 INTEGER, PRIMARY KEY( 商品コード)); FOREIGN( 商品コード) PRIMARYキー( 主キー)で宣言された項目には重複した内容を登録することはできなくなります FOREGNキー( 外部キー)で定義された項目には参照先テーブルに登録されていない内容を登録することは出来なくなります (これがリレーション関係です) 5 INSERT INTO INSERT INTO INSERT INTO 売上明細テーブル VALUES(1000,10,100); 売上明細テーブル VALUES(1000,11,120); 売上明細テーブル VALUES(1010,10,20); PRIMARYキー PRIMARYキー 4 INSERT INTO 商品テーブル VALUES(10,'ねぎ',50); INSERT INTO 商品テーブル VALUES(11,' 白菜 ',45); INSERT INTO 商品テーブル VALUES(50,' 苗 ',200); 6 SELECT 商品名 SUM( 個数 * 単価 ) AS 合計金額 FROM 売上明細テーブル商品テーブル WHERE 売上明細テーブル. 商品コード=30 GROUP BY 商品コード); 29 使用するSQLにより構文が多少異なる場合があります

30 LINUX 画面の何も表示されていない場所で右ボタンクリックを行い端末を開くを選択します以下のコマンドによりデータベースを sampledb という名前で作成します $createdb sampledb 以下のコマンドを使ってデータベースが作成されたことを確認します $psql -l 表示されるデータベース一覧表の中に sampledb があることを確認します先頭の $ と > は入力勧誘のプロンプトです以下のコマンドを使って sampledb データベースに売上げテーブルを登録します $psql sampledb >CREATE TABLE membertable( d_nbr INTEGER, d_date DATE, d_name CHAR(20)); 以下のコマンドを使って実際のデータを登録し Grant 命令を使って PHPからアクセスできるように設定します >INSERT INTO membertable VALUES(1,'2003/10/14', yamada ); >INSERT INTO pmembertable VALUES(2,'2003/10/14', kawada ); >INSERT INTO membertable VALUES(3,'2003/10/24', umeda ); >GRANT ALL ON membertable TO apache; >select * from paytable; > q 30

31 <HTML> <BODY> if ($con == false){ print ("データベース接続失敗 "); exit; $sql="select * from membertable order by if ($result==false){ print("sql 実行に失敗 "); exit; echo "<TABLE border=2 align=center>"; echo "<TR><TH> 番号 </TH><TH> 日付け</TH><TH> 氏名 </TH></TR>"; for ($i=0; $i<pg_num_rows($result); $i++){ $record=pg_fetch_array($result,$i); echo "<TR>"; printf("<td>%d</td>",$record['d_nbr']); printf("<td>%s</td>",$record['d_date']); printf("<td>%s</td>",$record['d_name']); echo "</TR>"; echo "</TABLE>"; pg_free_result($result); pg_close($con);?> </BODY> </HTML> プログラム概説 : 実行前に sampledb という名前でデータベースを作成しておいてください DataBase.phpプログラムを実行させるとデータベース上に登録されているデータが抜き出されてクライアント側に画面に表示データベース(sampledb)を使用可能状態にします $sql="select * from paytable order by paytable テーブルから全ての項目を行毎に配列で取り出します $record=pg_fetch_array($result,$i); pg_query コマンドで入力した配列から1レコード分 ($iで指定されたレコード) のデータを取り出します pg_free_result($result); $resultとして確保された領域を解放します pg_close($con); データベースの使用を終了し解放します 31

32 <HTML> <HEAD> <meta http-equiv="content-type" content="text/html; charset=euc-jp"> </HEAD> <style type="text/css">  </style> <BODY> <CENTER> <FORM METHOD=GET ACTION="manchat.php"> <B> 投稿メッセージ</B>( 日本語で100 文字以内 ) <BR> <TEXTAREA rows="2" Cols="100" NAME="cont"> </TEXTAREA> <INPUT TYPE="text" NAME="name" size=10 VALUE=" 匿名 "> <INPUT TYPE="submit" NAME="record" VALUE=" 投稿 / 確認 "> </FORM> </CENTER> <HR><HR> <?php $con=pg_connect("dbname=chatdb"); if (!empty($_get['record'])){ $contents=$_get['cont']; $name=$_get['name']; if ($contents <> ""){ $date=getdate(); $yymmdd=$date['year']."-".$date['mon']."-".$date['mday']; $hhmm=$date['hours'].":".$date['minutes'].":".$date['seconds']; $sqlcommand= INSERT INTO chattable values('$yymmdd','$hhmm','$name','$contents')"; $result=pg_query($sqlcommand); データベース名 :chatdb テーブル名 :chattable レコード名 : 続きです create table chattable(yymmdd date,hhmm time,name char(10),cont char(200)) チャット $sql="select * from chattable order by yymmdd,hhmm DESC"; $result=pg_query($sql); if ($result==false){ print("sql 実行に失敗 "); exit; for ($i=0; $i<pg_num_rows($result); $i++){ echo "<TABLE border=0 align=center width=900>"; $record=pg_fetch_array($result,$i); echo "<TR>"; printf("<td width=200>%s <BR>%s %s</td>",$record['name'],$record['yymmdd'],$record['hhmm']); printf("<td> %s</td>",$record['cont']); echo "</TR>"; echo "</TABLE>"; echo "<HR>"; pg_free_result($result); pg_close($con);?> </BODY> </HTML> 32

33 33

端末型払い出しの場合接続構成図フレッツグループから払出されたIPアドレス /32 NTT 西日本地域 IP 網フレッツグループフレッツグループから払出されたIPアドレス /

端末型払い出しの場合接続構成図フレッツグループから払出されたIPアドレス /32 NTT 西日本地域 IP 網フレッツグループフレッツグループから払出されたIPアドレス / CTU 端末型接続設定例 H19 年 10 月端末型払い出しの場合接続構成図フレッツグループから払出されたIPアドレス 172.25.1.1/32 NTT 西日本地域 IP 網フレッツグループフレッツグループから払出されたIPアドレス 172.25.1.2/32 172.25.1.1 172.25.1.2 192.168.24.1