フリーCGIを1時間で自分のページに設置する方法

無料ページ「使える.net」を使って

 ホームページ作りの最終兵器はCGIです。CGIとは Common Gateway Interface の略です。HTMLやJavaScriptのように、 単にWEBサーバーの情報をブラウザが読み込んでおしまいではなく、ブラウザの要求に対して WEBサーバーが何らかのプログラムを動かして処理をし、 再びブラウザに返すという一連の作業の仕組みをCGIといいます。 サーバーでプログラムを動かせるぶん、HTMLだけの場合やJavaScriptの処理に 比べて、格段に強力なインタラクティブ性を持たせることができます。CGIを使うと 掲示板やチャット、さらには高度なゲームなどもホームページに埋め込むことができるのです。

 このページは、平成14年度市民大学「ホームページ制作の基礎の基礎」において、 HTMLの基礎はほぼマスターしたので更に充実したページを作りたいという塾生の皆さんに、 フリーCGI(ホームページを演出するプログラム)を 設置する方法をマスターしていただくことを目的に作ったものです。 完全ビジュアル版(^^;)となっていますので、塾生さん以外の方にもフリーCGI設置の参考になるかと思います。 このとおりにすればなんと無料で(笑)、あなたも自分のホームページにフリーCGIが必ず設置できます。
 なお、フリーCGIが使える無料ホームページスペースとして 使える.netを利用させて いただきました。また、設置方法説明CGIプログラムとして EASY CGIじゃんけんCGIを 利用させていただきました。サンキューですm(._.)m ペコッ。


【使える.netの申込み】

@フリーCGI利用可の使える.netの無料ホームページスペースを申し込む。

「使える.net」無料ホームページスペース申込みページ


【使える.netでの「じゃんけんCGI」設置方法】

@フリーCGIプログラムのダウンロードサイトEASY CGIじゃんけんCGIダウンロードページを開く。

じゃんけんCGIダウンロードページ

A自分のパソコンに作成したjankenフォルダに「janken_cgi.txt」「1.gif」「2.gif」「3.gif」「sample.html」をダウンロードする。

◇↓「janken_cgi.txt」ダウンロードページ画面で、「ファイル」⇒「名前を付けて保存」⇒ jankenフォルダ に保存

「janken_cgi.txt」ダウンロードページ画面

◇「sample.html」ダウンロードページ画面で、「ファイル」⇒「名前を付けて保存」⇒ jankenフォルダ に保存

◇グー(1.gif)、チョキ(2.gif)、パー(3.gif)画像の上で右クリックして、「名前を付けて画像を保存」⇒ jankenフォルダ に保存

B「janken_cgi.txt」のファイル名を「janken.cgi」に変更する。

C「janken.cgi」をメモ帳で開いてperlのパスを書き換える。
 「使える.net」のperlのパスは、 #!/usr/bin/perl です。

perlのパスを書き換え

同様に、じゃんけんに勝ったら進むページのURLアドレスを書き込む。

進むページのURLアドレスを書き込む

D使える.netに jankenフォルダ を作成し、↓F〜Gの手順で jankenフォルダ のパーミッションを755にする。

※FFFTPで送信の場合は、自分のパソコンの jankenフォルダ を送信すれば その中の「janken.cgi」「1.gif」「2.gif」「3.gif」も送信されるので、フォルダなりファイルのパーミッション変更だけをすればいいのだけど、 基本は下記の手順です。

jankenフォルダ を作成

E「janken.cgi」「1.gif」「2.gif」「3.gif」を FFFTPで「使える.net」の jankenフォルダ に送る。

「janken.cgi」「1.gif」「2.gif」「3.gif」を jankenフォルダ に送る

F「janken.cgi」のパーミッションを755にする。「janken.cgi」の上で右クリック⇒属性変更

属性変更画面

G属性変更画面でパーミッションを755に⇒OKボタン

「janken.cgi」のパーミッションを755に変更

 ※ gif ファイルのパーミッションは、変更の必要はありません。


H「sample.html」のソース表示のフォーム部分を切り取って、自分のじゃんけんCGIを置きたいページに貼り付ける。

フォーム部分の貼り付け

Iその中のaction=janken/janken.cgiの部分を、自分がjanken.cgiを置いた場所に変更する。

 [例] FORM action=http://members××.tsukaeru.net/×××××/janken/janken.cgi method=post

↓画面例は私のページの場合

janken.cgiを置いた場所に変更

J変更したhtmlファイルをFFFTPで「使える.net」へ送る⇒上書きされる

変更したhtmlファイルを「使える.net」へ送る

KじゃんけんCGIを置いたページをブラウザで開くと↓画面のように表示されます\(^o^)/

じゃんけんCGIを置いたページ画面


【ホ−ムペ−ジ制作の基礎の基礎(HTML入門)】 【嶋くん(水商売!)】