第 8 回 ことはじめ レポート課題 氏名:菊地瑞紀 学籍番号:c1100673 語学クラス:英語6 コース(系):地域共創コース 1-A CGIでは例えば、"どこまで行きますか"という質問に対し"酒田"という答えが対 になるような形をとっている。 また、Hashではkeyが"酒田"という項目であり、valueは"どこまで行きますか"と いう質問というように対応している。 Hashではkeyとvalueが対応する形になっているが、CGIでも同じことが言えると いうところが両者の似ている点ではないかと考えた。 =============================================================================== 1-B .htaccess は .rbのファイルをCGIとして読みこむもののこと。 例えば public_html/kadai/というディレクトリのなかで.htaccessのファイルを 作り .rb をCGIとして読みこむと宣言しておく。 すると、kadaiのディレクトリのなかに作った.rbファイルのみがCGIとして認識 される。 *.html は使用者からデータを入力してもらうもの。 *.rb はhtmlで入力されたデータを処理し、結果を表示する。 *.htmlと*.rbは対応しており、 CGI での html において name は Hash での key にあたる。 また、option は value にあたっている。 =============================================================================== 1-C # formタグでセレクトボックス、ボタン、チェックボックス、 # ラジオボタンなどの送信フォームを作成する

# 送信ボタン # リセットボタン

また、フォームに入力されたデータは送信ボタンを押すとCGIプログラムに 送信され、処理が行なわれる。 =============================================================================== 1-D require 'cgi' # CGIを使うという要求を出す cgi = CGI.new('html4') # 使う型式をhtmlとする print("Content-type: text/html; charset=EUC-JP\n\n") # htmlに書きこむ、文字を日本語に arv = cgi ["arrive"] # Rubyに CGI でもらってきた値を代入 # ここでは"arrive" を arv として取りこむ =============================================================================== 2-A a [考えた設定] 山形市内の100円循環バスで大人は100円 小学生以下、障がい者、妊婦の方は料 金が無料です。 --------------------------------------------------------- b [元にしたプログラム] 授業で作成した、ticket.rb を元に作成しました。 ---------------------------------------------------------- c [プログラム本体] 【 プログラム 】 #!/usr/bin/env ruby require 'cgi' # CGI を使う cgi = CGI.new("html4") # CGI を HTML 文書に使う宣言 print("Content-type: text/html; charset=EUC-JP\n\n") # htmlに書きこむ、文字は日本語に str = cgi["start"] # Ruby に CGI でもらってきた値を代入 "start" → str arv = cgi["arrive"]# "arrive" → arv old = cgi["nenrei"]# "nenrei" → old として取りこむ year = Time.now.year # Time.new で日付を呼び出す month = Time.now.month day = Time.now.day print("\n") # 結果を html で表す print("\n") # html の上部をさすタグ print("発券結果\n") # タイトル print("\n") # css などを定義する print("\n") # head タグを閉じる print("\n") # ここからが本文 print("============================切り取り============================") print("

山形市街地100円循環バス

\n") # 見出し1 printf("

使用日 : %s年%s月%s日
※当日のみ有効

",year,month,day) # 日付を表示する printf("

乗車券 : %s -- %s 間

\n",str,arv) # 見出し2 区間を表す print("

運行時間 : 9:30〜18:30 (約10分おきに運行)

") # 運行時間案内 # 小学生以下と妊婦、障がい者は無料にしたかったので # if で場合分けをする if /大人/e =~ old # /**/e で日本語をEUC文字列と仮定して照合する # old 内の文字列が 大人 にマッチした場合 print("

乗車券料金 : 100円

\n") # 料金がかかるのでこちらを表示させる print("

使用方法 : バスに乗る際に乗務員に渡して下さい

\n") print("============================切り取り============================") else # それ以外だったら print("

乗車券料金 : 無料

") # こちらを表示させる print("

※車椅子の方は乗り降りの際、乗務員がお手伝い致します。

") print("============================切り取り============================") end # if の end print("\n") # body を閉じる print("\n") # html を閉じる 【 HTML 文書 】 オンライン券売機 山形市内循環100円バス

オンライン券売機



こちらは市内循環100円バスのオンライン発券機です。
出発する場所と目的地を入力して発券してください。


※小学生以下、障がい者、妊婦の方は無料です。



  • 出発する場所はどこですか



  • 目的地はどこですか

  • 【 プログラム の CSS 】 body { color: #000000; background: #a7f99a; } h1 { color: #000000; background: #f4b5e2; } .notice { color: blue; font-size: 4em; } .sign { background: black; margin-bottom: 10%; margin-right: 20%; margin-left: 20%; text-align: right; } 【 HTML 文書の CSS】 body { background:#f7d3aa fixed no-repeat right bottom; color :#000000 ; margin-left:5em; margin-right:5em } h1 { background: #effa39; margin: 50px 30px 0px 30px; text-align:center; padding: 0px 0px 0px 10px; border-left: solid 10px #880000; border: dotted #880000; color: #f72b07; } ------------------------------------------------------- d [実行結果] *HTMLでの実行結果 【 山形駅 -- 七日町間 (大人) 】 ============================切り取り============================ 山形市街地100円循環バス 使用日 : 2011年11月27日 ※当日のみ有効 乗車券 : 山形駅 -- 七日町 間 運行時間 : 9:30〜18:30 (約10分おきに運行) 乗車券料金 : 100円 使用方法 : バスに乗る際に乗務員に渡して下さい ============================切り取り============================ 【 山形駅 -- 七日町間 (小学生以下) 】 ============================切り取り============================ 山形市街地100円循環バス 使用日 : 2011年11月27日 ※当日のみ有効 乗車券 : 山形駅 -- 七日町 間 運行時間 : 9:30〜18:30 (約10分おきに運行) 乗車券料金 : 無料 ※車椅子の方は乗り降りの際、乗務員がお手伝い致します。 ============================切り取り============================ *Kterm での実行結果 (大人の場合) pan{c110067}% ./ticket.rb [~/public_html/rubycgi] (offline mode: enter name=value pairs on standard input) start="山形駅" arrive="七日町" nenrei="大人" Content-type: text/html; charset=EUC-JP 発券結果 ============================切り取り============================

    山形市街地100円循環バス

    使用日 : 2011年11月27日
    ※当日のみ有効

    乗車券 : 山形駅 -- 七日町 間

    運行時間 : 9:30〜18:30 (約10分おきに運行)

    乗車券料金 : 100円

    使用方法 : バスに乗る際に乗務員に渡して下さい

    ============================切り取り============================ (小学生以下の場合) pan{c110067}% ./ticket.rb [~/public_html/rubycgi] (offline mode: enter name=value pairs on standard input) start="山形駅" arrive="七日町" nenrei="小学生以下" Content-type: text/html; charset=EUC-JP 発券結果 ============================切り取り============================

    山形市街地100円循環バス

    使用日 : 2011年11月27日
    ※当日のみ有効

    乗車券 : 山形駅 -- 七日町 間

    運行時間 : 9:30〜18:30 (約10分おきに運行)

    乗車券料金 : 無料

    ※車椅子の方は乗り降りの際、乗務員がお手伝い致します。

    ============================切り取り============================ ---------------------------------------------------------- e [考察] 実行結果から HTML 上でも、Kterm 上でも上手く実行されていることがわかった。 よって、このプログラムにエラーは出ていようだ。 ================================================================================ 2-B 作成したバナーの掲載URL http://roy/~c110067/advertise2/logo.html 広告ページにも掲載 http://roy/~c110067/advertise2/ =============================================================================== 2-C 作成したPDFファイル掲載URL http://roy/~c110067/advertise2/r2_c110067.pdf 広告ページにも掲載 http://roy/~c110067/advertise2/ =============================================================================== 3、感想 今回は距離や値段の計算式がよく分からなかったため、簡単なプログラムになっ てしまった。大人と小学生以下、障がい者、妊婦の場合分けをしたかったのだが、 分からなかったため、次の授業のページを参考に作成した。 このプログラム作成してHTML と プログラム との連繋の仕組みを大体理解でき たので、次回からも頑張りたい。 =============================================================================== 4、参考文献 著者 : 西村まどか 基礎プログラミング II 第 8 回 (ことはじめ) 「基本の CGI ホームページの作りかた」 http://roy/~madoka/2011/r2/08/r2_08_06_theme_06_firstcgi.html 基礎プログラミング II 第 8 回 (ことはじめ) 「動作プログラム作成」 http://roy/~madoka/2011/r2/08/r2_08_08_theme_08_ruby.html 基礎プログラミング II 第 9 回 (ことえらび) 「結果を分岐させるには」 http://roy/~madoka/2011/r2/09/r2_09_01_theme_01_branch.html 城下町やまがた探検地図 : 100円循環バス停(山形駅前) http://www.kankou.yamagata.yamagata.jp/tankentai/archives/000154.html 協同学習者 宮原絵美里 ----------------------- 東北公益文化大学 公益学部 公益学科  2年 菊地瑞紀 c110067@f.koeki-u.ac.jp -----------------------