ログインページの作成

Image from Gyazo

ログインページの作成

ユーザ情報を格納しているUsersテーブルを利用して, ユーザのログインページを作成しましょう. ログインには,ユーザーのIDとパスワードを照合する機能が必要です. 最初にindex.htmlにログインページへのリンクを追加します. ログインページは login.html というファイル名で作成することにします.

<body>

  <h1>椙天市場</h1>

  <ul>
    <li><a href="cgi-bin/users.py">ユーザー情報</a></li>
	<li><a href="cgi-bin/items.py">商品情報</a></li>
    <li><a href="cgi-bin/histories.py">購買履歴</a></li>      
  </ul>

  <ul>
	<li><a href="login.html">ログイン</a></li>      
  </ul>

</body>

Image from Gyazo

新規に login.html を作成し,sugitenフォルダに配置します(実行権限の付与が必要).. login.html には下記のコードを記述します. formタグを利用して,IDとパスワードを入力するためのテキストフィールドと, データ送信のためのボタンを配置しています. ボタンをクリックすると IDとパスワードの情報をCGIのプログラムであるmain.py に送信する設定になっています.

<!DOCTYPE html>

<html>

  <head>
    <meta charset="utf-8">
    <title>ログイン</title>
  </head>

  <body>

    <h1>ログイン</h1>

    <form method="post" action="cgi-bin/main.py">
      <p>id: <input type="text" name="id" size="20"></p>
      <p>password: <input type="password" name="password" size="20"></p>
      <p><input type="submit" value="ログイン"></p>
    </form>    

  </body>

</html>

Image from Gyazo

ユーザの認証

ユーザのIDとパスワードの認証機能を main.py に実装します. 新規に main.py を作成し,cgi-binフォルダに配置します. main.py には下記のコードを記述します. データベースを操作するためのSQLiteモジュールと, CGIのデータを処理するためのcgiモジュールをインポートしています. cgi.FieldStorage関数で,login.html から送信されたIDとパスワードのデータを受け取ることができます. このデータは,ディクショナリ型(辞書型)となっており,idpassword というキーで値を取り出すことができます. それでは,ID:u01 ,パスワード:X2ng でログインしてみましょう. 入力したIDとパスワードが表示されればOKです.

#!/usr/bin/env python

import sqlite3
import cgi

# フォームの取得
form = cgi.FieldStorage()

form_id = form["id"].value
form_pw= form["password"].value

print ("Content-type:text/html\n\n")

print("<!DOCTYPE html>")
print("<html>")

print("<head>")
print("<meta charset='utf-8'>")
print("<title>メイン</title>")
print("</head>")

print("<body>")
print("<h1>メイン</h1>");

print("<p>" + form_id + "</p>")
print("<p>" + form_pw + "</p>")

print("</body>")

print("</html>")

Image from Gyazo

最後にユーザの認証機能を実装します. 下記のコードを main.py のbodyタグに追加します. ここでは,データベースsugiten.db を開き, Usersテーブルに対し, SELECT文のWHEHE句で該当するIDのパスワードを取得しています. ユーザが入力したパスワードと,Usersテーブルから取得したパスワードが一致すればログインは成功です. また,入力されたIDが存在しないとき,また,入力されたパスワードが一致しないときは, それぞれエラーであることを表示しています.

# データベースに接続
con = sqlite3.connect('sugiten.db')

# カーソルを取得
cur = con.cursor()

# IDに一致するpasswordを取得
sql = "SELECT password FROM Users WHERE id='" + form_id + "';"
records = cur.execute(sql)
pw = records.fetchone()

print ("Content-type:text/html\n\n")

print("<!DOCTYPE html>")
print("<html>")

print("<head>")
print("<meta charset='utf-8'>")
print("<title>メイン</title>")
print("</head>")

print("<body>")
print("<h1>メイン</h1>");

if pw == None:
    print("<p>IDが存在しません</p>")
    print("<p><a href='../login.html'>戻る</a></p>")
else:
    if form_pw == pw[0]:
        print("<p>ログインに成功しました</p>")
    else:
        print("<p>パスワードが一致しません</p>")
        print("<p><a href='../login.html'>戻る</a></p>")        

# データベースを切断
con.close()

Image from Gyazo

Image from Gyazo

Image from Gyazo

参考書籍

愛知県名古屋市にある椙山女学園大学 文化情報学部 向研究室の公式サイトです. 専門は情報科学であり,人工知能やデータベースなどの技術要素を指導しています. この公式サイトでは,授業で使用している教材を公開すると共に, ベールに包まれた女子大教員のミステリアスな日常を4コマ漫画でお伝えしていきます. サイトに関するご意見やご質問はFacebookまたはTwitterでお問い合わせください.