Q&A
###前提・実現したいこと
cgi について質問です。
a.html で入力したテキストをもとに b.cgi で処理をしてまたもとの a.html に処理をした結果を
出力するにはどうすればよいのでしょうか？？
省略した具体例としては、
a.html には aaa というテキストがあり、a という文字を <form> でテキスト入力した
文字に置き換える、というのを作ろうと思っています。
このとき、html と cgi はどのような構成？ですればよいのでしょうか。
cgi ファイルに全て html コードを書くのでしょうか？
方針がわからなく進まない状態です。
ズレたことを質問しているかもしれませんが、
ご教授お願いします。
###発生している問題・エラーメッセージ
html ファイルから cgi ファイルにデータを渡し、処理をして、もとの html ファイルに出力する方法がわからない。
###該当のソースコード(実現したいことの一部のコードですので参考までに載せて置く程度のものです)
html
1<html> 2<head> 3<meta http-equiv="Content-Type" content=\"text/html\"; charset="UTF-8\" /> 4</head> 5<body> 6<div align="center"> 7<form action="../cgi-bin/lec02.cgi" method="post"> 8<table border=2> 9 <tr><th>暗号</th> 10 <th>A</th> 11 <th>B</th> 12 <th>C</th><tr> 13 <tr><th>復号</th> 14 <td><input type="text" name="a" size="1" maxlength="1"></td> 15 <td><input type="text" name="b" size="1" maxlength="1"></td> 16 <td><input type="text" name="c" size="1" maxlength="1"></td> 17</tr> 18</table> 19<input type="submit" value="復号"> 20</div> 21</body> 22</html> 23 24
###試したこと
他サイト検索など
###補足情報(言語/FW/ツール等のバージョンなど)
cgi は Python で書くつもりです。
回答1件
0
ベストアンサー
cgiの作り方ですが、今回のご質問のケースでは、以下のように進めれば良いかと思います。
1.「b.cgi」で処理した結果となるはずの、「a.html」だけをデザインの為に最初に作り、chromeなどのブラウザーで見た目を確認する。
具体的には、htmlのinput要素にvalueが加わったのがそれになります。
例：
html
1<input type="text" name="a" size="1" maxlength="1" value="1"> 2<input type="text" name="b" size="1" maxlength="1" value="2"> 3<input type="text" name="c" size="1" maxlength="1" value="3">
2.で造ったhtmlを吐き出すcgiプログラムを作成する。
cgiはformタグで指定されたものが呼び出されるわけですから、
<form action="../cgi-bin/lec02.cgi" method="post">
このケースの "../cgi-bin/lec02.cgi" が動いたときにname属性の各"a", "b", "c"の値を取り出して処理し、更にHTTPレスポンスのコンテントボディとして返すhtml中のvalue属性にセットして、printで出力すれば良い、と言うことになります。
要は、a.htmlをテンプレートとして、valueの部分のみを差し替えてhtmlとして出力するプログラムにすれば良いわけです。
実例として、lec02.cgiをサンプルとして作ってみましたので参考になさってください。htmlは「実現したいことの一部...」をほぼそのままテンプレートとして使います。cgiとして動いていることが分かりやすいよう、フォームをサブミットすると現在日時の表示と、フォームのinput部分に数字を入れれば+1, そうでなければそのまま出力するようにしています。Python3で作成しています。
Python
1#!/usr/bin/python3 2# -*- coding: utf-8 -*- 3# 4# cgi-bin/lec02.cgi 5 6import cgi 7import datetime 8 9html_format = """ 10<html> 11 <head> 12 <meta http-equiv="Content-Type" content=\"text/html\"; charset="UTF-8\" /> 13 </head> 14 15 <body> 16 <div align="center"> 17 <form action="../cgi-bin/lec02.cgi" method="post"> 18 <table border=2> 19 <tr>{0}</tr> 20 <tr> 21 <th>暗号</th> 22 <th>A</th> 23 <th>B</th> 24 <th>C</th> 25 <tr> 26 <tr><th>復号</th> 27 <td><input type="text" name="a" size="1" maxlength="1" value="{1}"></td> 28 <td><input type="text" name="b" size="1" maxlength="1" value="{2}"></td> 29 <td><input type="text" name="c" size="1" maxlength="1" value="{3}"></td> 30 </tr> 31 </table> 32 <input type="submit" value="復号"> 33 </form> 34 </div> 35 </body> 36</html> 37""" 38 39# formにセットされた値を取得 40form = cgi.FieldStorage() 41 42# 値が数字なら+1, 文字列ならそのまま 43v1 = form.getvalue('a') 44if v1: 45 if v1.isdigit(): 46 v1 = int(v1) + 1 47else: 48 v1 = "" 49 50v2 = form.getvalue('b') 51if v2: 52 if v2.isdigit(): 53 v2 = int(v2) + 1 54else: 55 v2 = "" 56 57v3 = form.getvalue('c') 58if v3: 59 if v3.isdigit(): 60 v3 = int(v3) + 1 61else: 62 v3 = "" 63 64# 現在日時を取得 65now = datetime.datetime.now() 66print("Content-Type: text/html") 67print() 68 69# 現在日時、v1,v2,v3をhtmlにセット 70html = html_format.format(now, v1, v2, v3) 71print(html)
動作確認の一例ですが、lec02.cgi を cgi-bin/ディレクトリ下に置き、「実現したいことの一部...」のhtmlをdoc/top.html として配置します。
Bash
1$ find ./ 2./ 3./cgi-bin 4./cgi-bin/lec02.cgi 5./doc 6./doc/top.html 7 8$ python3 -m http.server --cgi 9Serving HTTP on 0.0.0.0 port 8000 (http://0.0.0.0:8000/) ...
上記のように動かした場合、ブラウザーからは以下のどちらのURLからでもアクセスできます。
http://localhost:8000/doc/top.html (トップページとして表示)
http://localhost:8000/cgi-bin/lec02.cgi
chromeブラウザーで見ると、以下のように表示されます。
python3でのcgiですが、サンプルのlec02.cgiは「formの値を取り出して、htmlで返せば良い」と言うことを示す為に、分かり易くあえて冗長に造ったところもありますので、公式の文書を読んでみてください。
投稿2017/10/09 17:34
編集2017/10/10 01:09
総合スコア9256
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2017/10/10 05:44
2017/10/10 05:50