送信した画像をオウム返しに表示させてみよう

フォーム<input type="file" name="tenpu" value=""> にて添付送信された画像ファイルが、オウム返しに表示される CGI を作ってみてください

簡単のため、セキュリティ対策は考慮しなくてもよいです

ファイル送信フォーム ⇒ 受信画像を表示

⇒ ヒント

Hint

解説にあるように、[ formtest.cgi ]を実行して、マルチパートフォームデータとして送られてきた添付書類のデータの形の特徴をよく把握してください
受信データから画像データを分離するには、正規表現を用いたパターンマッチを使うと、プログラムを簡潔に書けます
画像の出力に関しては最初の「出力方法 > GIF 画像を表示させる」を参照してください
（ヘッダのContent-Disposition,Content-Lengthの行は省略できます）

⇒ 答え

Solution

html ファイル：ファイル名 index.html

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="ja">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
  <meta http-equiv="Content-Style-Type" content="text/css" >
  <title>Upload demo</title>
</head>
<body>
<form action="up.cgi" method="POST" enctype="multipart/form-data">
  <input type="file"   name="tenpu"  value="" size="36" tabindex="1" accesskey="1">
  <input type="submit" name="submit" value="送る"       tabindex="2" accesskey="2">
</form>
</body>
</html>

CGI ファイル：ファイル名 up.cgi

#!/usr/local/bin/ruby -Ks
if /boundary=([\-\w]+)$/ =~ ENV['CONTENT_TYPE'].to_s then # データ送られてきた場合を判別
  boundary = $1                                      # データ境界の目印を変数boundaryに写し取る
  while data = STDIN.gets(boundary) do               # 入力を境界で区切って、変数dataに写し取る
    if /\A[\r\n]*[^\r\n]*name="tenpu";/ =~ data then # データの最初に、name="tenpu"; が含まれる場合のみを選別して処理
      data.sub!(/\A[\r\n]*[^\n]*\n/,"")              # データ最初の空行と１行目を取り除く
      data.sub!(/[\r\n]*\-\-#{ boundary }/,"")       # データ終端のゴミを除去
      next unless data.split(/\n\r?\n\s*/,2)[1]      # データの中身が空っぽ(改行スペース含む)なら、スキップ
      print data                                     # データ出力
      exit                                           # データ出力が完了したら、ここで強制的にプログラム終了
    end
  end
end
puts "Location: ./index.html"                        # html ファイルへジャンプ
puts

⇒　次の問題に進む

送受信＿フォームデータの扱い-演習編

Problem3: 送信した画像をオウム返しに表示させてみよう

Hint

Solution