WEBrickを使って静的なhtmlを返す(〜 GETとPOSTの違い 〜)

http://localhost:8000/fom.htmlにアクセスして以下の画面が表示されるようにする

Image from Gyazo

(1)まずWEBrickというライブラリを使ってWebサーバーを構築する

webrick.rbファイルを作成し以下のコードを記述

require 'webrick'

server = WEBrick::HTTPServer.new({ 
  :DocumentRoot => './',
  :BindAddress => '127.0.0.1',
  :Port => 8000
})  
解説

require 'ライブラリ' :外部ライブラリを読み込むメソッド
server = WEBrick::HTTPServer.new():newメソッドでWEBrick::HTTPServerクラスからインスタンスを作り、返り値をserverに代入する。
:DocumentRoot => './', :アクセス先はhttp~~/
:BindAddress => '127.0.0.1' :127.0.0.1は自分のパソコンにアクセスできる特別なipアドレス
:Port => 8000 :ポート番号8000番

(2)次にHTMLの作成

WEBrickはデフォルトで同一ディレクトリにあるindex.htmlファイルをレスポンスとして返す。なのでwebrick.rbファイルがあるディレクトリにform.htmlディレクトリを作り、そこにindex.htmlを入れる。
これでhttp://localhost:8000/fom.htmlにアクセスしたときにindex.htmlが返ってくる

form.html/index.htmlに以下を記述

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <h2>GETで送る</h2>
  <ul>
  <form action="/form_get" method="get">  
    <li><label for="user_name">ユーザー名</label>
    <input type="text" name="user_name"></li>

    <li><label for="age">年齢</label>
    <input type="text" name="age"></li> 
  
  <button type="submit">投稿</button>
</form>
  </ul>


  <h2>POSTで送る</h2>
  <ul>
  <form action="/form_post" method="post">  
    <li><label for="user_name">ユーザー名</label>
    <input type="text" name="user_name"></li>

    <li><label for="age">年齢</label>
    <input type="text" name="age"></li> 
  
  <button type="submit">投稿</button>
</form>
  </ul>
</body>
</html>

解説

  • action 属性は、フォームで収集したデータを送信すべき場所 (URL) を定義します
  • method 属性は、データを送信するために使用する HTTP メソッド ( get または post ) を定義します
  • name 属性は、送るデータの名前(サーバーはその名前で受け取る)
  •  value属性は、入力された値が入る

これは、単なる静的なページを返している(HTMLの限界)

次回Rubyを使って投稿者ごとに異なるページを返すプログラムを作る(動的ページの作成)